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

全局安装 NestJS

bash 复制代码
npm install -g @nestjs/cli

创建一个 NestJS 项目

bash 复制代码
nest new management_nest

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

启动项目(热更新)

bash 复制代码
pnpm run start:dev

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

查看是否启动成功:

bash 复制代码
curl http://localhost:3333

Hello World!

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

创建用户模块

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

js 复制代码
"generateOptions": { 
    "spec": false 
 }

我这里就不配置了

bash 复制代码
nest g res user

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

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

同时也会自动在AppModule引入:

连接 MySql 数据库

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

bash 复制代码
pnpm install @nestjs/typeorm typeorm mysql2 -S

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

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

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

然后新建数据库manageAdmin

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

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

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

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

插入和查询数据

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

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

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

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

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

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

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

bash 复制代码
pnpm install cross-env @nestjs/config

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

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

.env.stage.default

env 复制代码
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 如下:

tsconfig.lib.json

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

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

ts 复制代码
export * from './db.module';

然后修改main.ts

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

个人学习记录!!!

相关推荐
暮毅2 小时前
10.Node.js连接MongoDb
数据库·mongodb·node.js
~甲壳虫7 小时前
说说webpack中常见的Plugin?解决了什么问题?
前端·webpack·node.js
~甲壳虫8 小时前
说说webpack中常见的Loader?解决了什么问题?
前端·webpack·node.js
~甲壳虫8 小时前
说说webpack proxy工作原理?为什么能解决跨域
前端·webpack·node.js
熊的猫9 小时前
JS 中的类型 & 类型判断 & 类型转换
前端·javascript·vue.js·chrome·react.js·前端框架·node.js
前端青山18 小时前
Node.js-增强 API 安全性和性能优化
开发语言·前端·javascript·性能优化·前端框架·node.js
GDAL21 小时前
npm入门教程1:npm简介
前端·npm·node.js
郑小憨1 天前
Node.js简介以及安装部署 (基础介绍 一)
java·javascript·node.js
lin-lins1 天前
模块化开发 & webpack
前端·webpack·node.js
GDAL2 天前
npm入门教程13:npm workspace功能
前端·npm·node.js