Awesome Prisma 项目教程

Awesome Prisma 项目教程

awesome-prismaA collection of awesome things regarding Prisma ecosystem.项目地址:https://gitcode.com/gh_mirrors/aw/awesome-prisma

1. 项目的目录结构及介绍

awesome-prisma/
├── components/
│   └── ... (React 组件)
├── data/
│   └── ... (数据处理文件)
├── graphql/
│   └── ... (GraphQL 相关文件)
├── lib/
│   └── ... (库文件)
├── pages/
│   └── ... (Next.js 页面)
├── prisma/
│   └── ... (Prisma 相关文件)
├── public/
│   └── ... (静态资源)
├── styles/
│   └── ... (样式文件)
├── .env.example
├── .gitignore
├── README.md
├── next-env.d.ts
├── package.json
├── postcss.config.js
├── tailwind.config.js
└── tsconfig.json

目录结构介绍

• components: 包含 React 组件。
• data: 包含数据处理文件。
• graphql: 包含 GraphQL 相关文件。
• lib: 包含库文件。
• pages: 包含 Next.js 页面。
• prisma: 包含 Prisma 相关文件。
• public: 包含静态资源。
• styles: 包含样式文件。
• .env.example: 环境变量示例文件。
• .gitignore: Git 忽略文件。
• README.md: 项目说明文件。
• next-env.d.ts: Next.js 类型定义文件。
• package.json: 项目依赖和脚本文件。
• postcss.config.js: PostCSS 配置文件。
• tailwind.config.js: Tailwind CSS 配置文件。
• tsconfig.json: TypeScript 配置文件。

2. 项目的启动文件介绍

package.json

{
  "name": "awesome-prisma",
  "version": "1.0.0",
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "next": "latest",
    "react": "latest",
    "react-dom": "latest",
    "prisma": "latest"
  },
  "devDependencies": {
    "typescript": "latest",
    "eslint": "latest",
    "eslint-config-next": "latest"
  }
}

启动命令

• 开发模式: npm run dev
• 构建项目: npm run build
• 启动项目: npm run start
• 代码检查: npm run lint

3. 项目的配置文件介绍

.env.example

DATABASE_URL="postgresql://user:password@localhost:5432/mydatabase"

prisma/schema.prisma

datasource db {
  provider = "postgresql"
  url      = env("DATABASE_URL")
}

generator client {
  provider = "prisma-client-js"
}

model User {
  id    Int     @id @default(autoincrement())
  name  String
  email String  @unique
}

next.config.js

module.exports = {
  reactStrictMode: true,
  swcMinify: true,
};

tailwind.config.js

module.exports = {
  purge: ['./pages/**/*.{js,ts,jsx,tsx}', './components/**/*.{js,ts,jsx,tsx}'],
  darkMode: false,
  theme: {
    extend: {},
  },
  variants: {
    extend: {},
  },
  plugins: [],
};

tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "lib": ["dom", "es2015"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "no

awesome-prismaA collection of awesome things regarding Prisma ecosystem.项目地址:https://gitcode.com/gh_mirrors/aw/awesome-prisma