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

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

个人学习记录!!!

相关推荐
杰九25 分钟前
【环境配置】maven,mysql,node.js,vue的快速配置与上手
java·vue.js·spring boot·mysql·node.js·maven
GISer_Jing27 分钟前
Node.js中如何修改全局变量的几种方式
前端·javascript·node.js
垣宇20 小时前
Vite 和 Webpack 的区别和选择
前端·webpack·node.js
爱吃南瓜的北瓜20 小时前
npm install 卡在“sill idealTree buildDeps“
前端·npm·node.js
翻滚吧键盘20 小时前
npm使用了代理,但是代理软件已经关闭导致创建失败
前端·npm·node.js
浪九天21 小时前
node.js的版本管理
node.js
浪九天1 天前
node.js的常用指令
node.js
浪九天1 天前
Vue 不同大版本与 Node.js 版本匹配的详细参数
前端·vue.js·node.js
小纯洁w2 天前
Webpack 的 require.context 和 Vite 的 import.meta.glob 的详细介绍和使用
前端·webpack·node.js
熬夜不洗澡2 天前
Node.js中不支持require和import两种导入模块的混用
node.js