# nuxt3+tailwindcss+prisma

**Repository Path**: huangxiaolun/nuxt3-tailwindcss-prisma

## Basic Information

- **Project Name**: nuxt3+tailwindcss+prisma
- **Description**: 学习
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2023-11-03
- **Last Updated**: 2024-11-05

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

安装

```
  npm install -D @nuxtjs/tailwindcss
  
  去nuxt.config.ts配置   modules:['@nuxtjs/tailwindcss']
  
 npx tailwindcss init 
 
 配置自己的主题 
```

> 源码  https://github.com/insidewebdev/twitter-clone

```
tilwindcss 遇到一个问题 添加 hidden 样式会自动注入 一个( div {
    display: block !important;
}  用户代理样式表  )      导致 sm:block 覆盖不了 解决办法  添加一个！ sm:!block

艹 这个都不知道在哪儿查
```



> 使用prisma3.14.0 

这个项目是nuxt3 所以先在server->api->auth  

```
export default defineEventHandler(async (event) => {
    const body = await readBody(event)
    }) 查看body 
```

前面部分参考这个文章 https://blog.csdn.net/snowball_li/article/details/128013833



```
"@prisma/client": "^3.14.0",
这个用来查询的 
 
 "prisma": "^3.14.0"
    
  “ npx prisma init --datasource-provider mongodb” 生成文件及文件夹  prisma --> schema.prisma    配置provider = "postgresql"
  
  datasource：定义数据库类型和链接地址
    generator：指定哪个客户端向数据发送查询语言
    model：定义数据库 Schema。每个 Model 都将映射到数据库底层中的一个表中。目前，我们还没有 model，接下来我们来定义下 model。

```

```text
打开mogonDB 连接成功之后· mongodb://localhost:27017/kudos（ps:这个地址不行 要用集群的 ）  会有一个地址 前面是路由地址 后面是数据库名 
    连接数据库  上面生成之后 在.env 里面 放进去 
    
    然后就是在schema.prisma里面建模  完成之后执行npx prisma db push 推送到数据库 
    
    npx prisma studio 查看数据
    
    ps： mogonDB 不得行 需要设置集群  主要是也不会 
    只能用 PostgreSQL试试 
```

> 使用postgreSql

```agsl
    1.本地电脑上安装docker 
    2.根文件夹中创建一个docker-compose.yml文件
    3.配置 
    # docker-compose.yml
version: '3.1'
services:
  db:
    image: postgres
    volumes:
       - ./postgres:/var/lib/postgresql/data
    restart: always
    ports:
      - 5432:5432
    environment:
      - POSTGRES_USER=myuser
      - POSTGRES_PASSWORD=mypassword

  adminer:
    image: adminer
    restart: always
    ports:
      - 8080:8080
      4.先启动本地docker再启动 docker-compose up -d 
      5.http://localhost:8080/ 便可以使用可视化页面访问 postgres 数据库 用户账号名如上
      6.docker-compose down 以下命令停止 docker 服务，数据库数据不会丢失，因为它存在同目录下的 postgres 目录中
      
      7.给.env 设置 DATABASE_URL="postgres://myuser:mypassword@localhost:5432/median-db"
```

> 迁移数据库 每次建模后  npx prisma migrate dev --name "名字"    npx prisma db push 

>> 参考项目 ：https://juejin.cn/post/7112694027212259364?searchId=20231109110135637977EA9C5FF848D40A 
> https://article.juejin.cn/post/7153283997060202527