Vue3 + Nest 实现博客管理系统 后端篇(一):NestJS创建项目及数据库连接

全局安装 NestJS

npm install -g @nestjs/cli

创建一个 NestJS 项目

nest new management_nest

image.png
我这里选择的是pnpm,选择之后等待创建完成就可以在src目录下面看到这几个文件

image.png

启动项目(热更新)

pnpm run start:dev

正常情况下项目会在默认的3000端口启动,如果端口被占用的话,可以修改src/main.ts文件夹里面的监听端口号(换成未被占用的即可),再次启动即可

image.png
查看是否启动成功:

curl http://localhost:3333

Hello World!

或者在浏览器打开http://localhost:3333,页面显示Hello World!

创建用户模块

如果不想生成测试文件可以在nest-cli.json中配置

"generateOptions": { 
    "spec": false 
 }

我这里就不配置了

nest g res user

它会让你选择是哪种代码风格,这里我选择的是http的REST风格api:

image.png
然后会让你选择是否生成CRUD代码:选择是
等待执行完毕,就会生成整个模块的CRUD + RESR api 的代码

image.png

image.png
同时也会自动在AppModule引入:

image.png

连接 MySql 数据库

NestJS连接数据库我选择的是MySql,首先先安装@nestjs/typeormtypeormmysql2
执行命令:

pnpm install @nestjs/typeorm typeorm mysql2 -S

连接数据库需要你本地安装mysql数据库,这个就自行百度~
其次确保你的mysql是启动状态

image.png
关于数据库可视化操作的工具有很多,NavicatmysqslWorkBench等等。。。我这里使用的是VScode的插件Database Client

image.png
插件安装好之后,输入数据库的密码进行连接即可

然后新建数据库manageAdmin

image.png
下一步开始连接mysql,进入app.module.ts中进行数据库连接的配置

autoLoadEntities 自动加载实体配置,forFeature()注册的每个实体都自动加载

image.png
然后重新启动,如果数据库并没有添加User表,可以看下user.module.ts,添加下图中圈起来的代码,重新启动

image.png
添加成功就可以看到添加的User表

image.png

插入和查询数据

user.service.ts 文件里面添加以下代码

image.png
打开调试工具进行接口调试,我这里使用的是apifox,调用 user 接口,传入 username 和 password

image.png
然后在database里面就可以看到插入的这条数据

在面板中打开时候会一直查询,点击关闭之后,再点击执行就可以看到这条数据了

image.png

image.png
还可以执行查询接口,看数据是否已经存在

image.png

一般来说数据库的配置包含了一些敏感信息不宜写在代码中提交到远程仓库,所以我们可以将配置写在配置文件中,然后提交 git 时候将生产环境的配置文件其忽略,这里我们新建.env.stage.default.env.stage.dev.env.stage.prod文件分别存放默认、开发与生产环境配置

我们还需要安装 cross-env 来判断我们是处于什么环境,检查下有没有安装@nestjs/config,如果没有也要安装

pnpm install cross-env @nestjs/config

首先修改package.json 里面的启动命令(打包修改一样),在命令后面添加 STAGE=dev 用于判断不同的环境加载不同的环境配置

image.png
在根目录创建 .env.stage.default.env.stage.dev.env.stage.prod 并在default文件里面配置数据库基本配置,在prod 文件里面添加DB_SYNC=false,这里面主要是配置生产的数据库一些配置

image.png
.env.stage.default

DB_HOST=localhost
DB_PORT=3306
SERVE_PORT=3333
DB_USERNAME=root
DB_PASSWORD=123456
DB_DATABASE=manageadmin
DB_SYNC=true

接下来就是修改链接数据库的配置app.module.ts,由于数据库配置比较多,我们可以单独把这些配置抽离出去,首先在根目录创建libs/db/src/index.ts 以及在libs/src/下面创建db.module.ts文件,在libs/db/下面创建tsconfig.lib.json 如下:
image.png

image.png
tsconfig.lib.json

{
  "extends": "../../tsconfig.json",
  "compilerOptions": {
    "declaration": true,
    "outDir": "../../dist/libs/db"
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "dist", "test", "**/*spec.ts"]
}

libs/db/src/db.module.ts

import { Global, Module } from '@nestjs/common';
import { TypeOrmModule } from '@nestjs/typeorm';
import { ConfigModule, ConfigService } from '@nestjs/config';

@Global()
@Module({
  imports: [
    ConfigModule.forRoot({
      isGlobal: true,
      envFilePath: [`.env.stage.${process.env.STAGE}`, '.env.stage.default'],
    }),
    TypeOrmModule.forRootAsync({
      imports: [ConfigModule],
      inject: [ConfigService],
      useFactory: (ConfigService: ConfigService) => ({
        type: 'mysql',
        host: ConfigService.get('DB_HOST'),
        port: ConfigService.get('DB_PORT'), // 端口号
        username: ConfigService.get('DB_USERNAME'), // 用户名
        password: ConfigService.get('DB_PASSWORD'), // 密码
        database: ConfigService.get('DB_DATABASE'), //数据库名
        autoLoadEntities: true, //自动加载实体配置,forFeature()注册的每个实体都自己动加载
        synchronize: ConfigService.get('DB_SYNC'), // 是否将实体同步到数据库
      }),
    }),
  ],
})
export class DbModule {}

libs/db/src/index.ts

export * from './db.module';

然后修改main.ts

image.png
接下来重启项目,测试刚才的查询是否好使,如果重启失败报错,请仔细检查代码是否有出入

个人学习记录!!!

© 版权声明
THE END
喜欢就支持一下吧
点赞0

Warning: mysqli_query(): (HY000/3): Error writing file '/tmp/MYkLqaOp' (Errcode: 28 - No space left on device) in /www/wwwroot/583.cn/wp-includes/class-wpdb.php on line 2345
admin的头像-五八三
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

图形验证码
取消
昵称代码图片