NestJs框架快速入门(V6.5)

￡神魔★判官ぃ 2022-01-16 00:13 303阅读 0赞

Nest是构建高效可扩展的 Node.js Web 应用程序的框架。  
默认使用JavaScript的超集`TypeScript`进行开发。

### 环境准备 ###

查看node和npm版本:

$ node --version
    v10.16.0
    
    $ npm --version
    6.9.0

### 安装@nestjs/cli ###

使用 npm 全局安装 `@nestjs/cli`:

$ npm i -g @nestjs/cli
    /usr/local/bin/nest -> /usr/local/lib/node_modules/@nestjs/cli/bin/nest.js
    + @nestjs/cli@6.5.0
    removed 3 packages and updated 13 packages in 6.982s

使用 `nest --version` 命令查看 nest 当前版本:

$ nest --version
    6.5.0

使用 `nest new` 命令创建一个名为 nest-app 的项目:

$ nest new nest-app    
    ⚡  We will scaffold your app in a few seconds..
    
    CREATE /nest-app/.prettierrc (51 bytes)
    CREATE /nest-app/README.md (3370 bytes)
    CREATE /nest-app/nest-cli.json (84 bytes)
    CREATE /nest-app/nodemon-debug.json (163 bytes)
    CREATE /nest-app/nodemon.json (67 bytes)
    CREATE /nest-app/package.json (1804 bytes)
    CREATE /nest-app/tsconfig.build.json (97 bytes)
    CREATE /nest-app/tsconfig.json (325 bytes)
    CREATE /nest-app/tslint.json (426 bytes)
    CREATE /nest-app/src/app.controller.spec.ts (617 bytes)
    CREATE /nest-app/src/app.controller.ts (274 bytes)
    CREATE /nest-app/src/app.module.ts (249 bytes)
    CREATE /nest-app/src/app.service.ts (142 bytes)
    CREATE /nest-app/src/main.ts (208 bytes)
    CREATE /nest-app/test/app.e2e-spec.ts (561 bytes)
    CREATE /nest-app/test/jest-e2e.json (183 bytes)
    
    ? Which package manager would you ❤️  to use? npm
    ▹▹▹▸▹ Installation in progress... ☕
    ?  Successfully created project nest-app
    ?  Get started with the following commands:
    
    $ cd nest-app
    $ npm run start
    
        Thanks for installing Nest ?
    Please consider donating to our open collective
        to help us maintain this package.
                             
    ?  Donate: https://opencollective.com/nest

### 启动项目 ###

进入项目，并启动项目

$ cd nest-app 
    $ npm run start
    > nest-app@0.0.1 start /Users/wangtom/development/node/nest-app
    > ts-node -r tsconfig-paths/register src/main.ts
    [Nest]3226-2019-06-13 [NestFactory] Starting Nest application...
    [Nest]3226-2019-06-13 [InstanceLoader] AppModule dependencies initialized +87ms
    [Nest]3226-2019-06-13 [RoutesResolver] AppController {/}: +41ms
    [Nest]3226-2019-06-13 [RouterExplorer] Mapped {/, GET} route +16ms
    [Nest]3226-2019-06-13 [NestApplication] Nest application successfully started +43ms

打开浏览器，访问 `http://localhost:3000/` 就可以看到`Hello World!`页面输出了。

或者在终端使用 `curl` 请求:

$ curl -i localhost:3000
    HTTP/1.1 200 OK
    X-Powered-By: Express
    Content-Type: text/html; charset=utf-8
    Content-Length: 12
    ETag: W/"c-Lve95gjOVATpfV8EL5X4nxwjKHE"
    Date: Thu, 13 Jun 2019 08:16:42 GMT
    Connection: keep-alive
    
    Hello World!%

可以看到， 输出了 `Hello World!` 字符串。  
使用 `-i` 参数，表示要输出 header 头信息。  
在 header 头信息中，我们可以看到，`X-Powered-By` 值为 `Express`， 就是告诉我们这个网站或框架底层是 `Expres` 框架。

### 项目结构 ###

查看一下项目结构:

$ ll nest-app 
    total 640
    -rw-r--r--    1 wangtom  staff   3.3K  6 13 16:13 README.md
    -rw-r--r--    1 wangtom  staff    84B  6 13 16:13 nest-cli.json
    drwxr-xr-x  585 wangtom  staff    18K  6 13 16:14 node_modules
    -rw-r--r--    1 wangtom  staff   163B  6 13 16:13 nodemon-debug.json
    -rw-r--r--    1 wangtom  staff    67B  6 13 16:13 nodemon.json
    -rw-r--r--    1 wangtom  staff   287K  6 13 16:14 package-lock.json
    -rw-r--r--    1 wangtom  staff   1.8K  6 13 16:14 package.json
    drwxr-xr-x    7 wangtom  staff   224B  6 13 16:13 src
    drwxr-xr-x    4 wangtom  staff   128B  6 13 16:13 test
    -rw-r--r--    1 wangtom  staff    97B  6 13 16:13 tsconfig.build.json
    -rw-r--r--    1 wangtom  staff   325B  6 13 16:13 tsconfig.json
    -rw-r--r--    1 wangtom  staff   426B  6 13 16:13 tslint.json

可以使用 tree 命令查看nest-app的目录结构:

比如使用 `tree ./nest-app -L 1`, 查看1级目录结构。

./nest-app
    ├── README.md
    ├── nest-cli.json
    ├── node_modules/
    ├── nodemon-debug.json
    ├── nodemon.json
    ├── package-lock.json
    ├── package.json
    ├── src  # 源码目录
    │   ├── app.controller.spec.ts
    │   ├── app.controller.ts # 控制器类
    │   ├── app.module.ts  # 模块
    │   ├── app.service.ts # 服务类
    │   └── main.ts   # 入口文件
    ├── test   # 测试目录
    │   ├── app.e2e-spec.ts
    │   └── jest-e2e.json
    ├── tsconfig.build.json
    ├── tsconfig.json
    └── tslint.json

可以看到，和 Angular 的项目结构很相似。

`src/main.ts` 是项目的入口文件, 定义了一个异步方法(bootstrap)来启动应用，默认监听端口 `3000`:

// main.ts
    import {
         NestFactory } from '@nestjs/core';
    import {
         AppModule } from './app.module';
    
    async function bootstrap() {
        
      const app = await NestFactory.create(AppModule);
      await app.listen(3000);
    }
    bootstrap();

控制器: `app.controller.ts`

// app.controller.ts
    import {
         Controller, Get } from '@nestjs/common';
    import {
         AppService } from './app.service';
    
    @Controller()
    export class AppController {
        
      constructor(private readonly appService: AppService) {
        }
    
      @Get()
      getHello(): string {
        
        return this.appService.getHello();
      }
    }

控制器中定义了一个名为 `getHello()` 的方法，使用 `@Get` 注解，表示可以通过 Get 方法访问。  
控制器构造方法中引入了私有只读的服务类 `AppService`， 在 `getHello()` 方法中调动了服务类(AppService)中的 `getHello()` 方法。

服务类: app.service.ts

// app.service.ts
    import {
         Injectable } from '@nestjs/common';
    
    @Injectable()
    export class AppService {
        
      getHello(): string {
        
        return 'Hello World!';
      }
    }

在服务类AppService中，定义了`getHello()`方法，只返回了字符串 `Hello World!`。

### 小试牛刀 ###

熟悉了项目目录结构与基本运行代码后，我们来增加一些自己的方法，感受一个这个框架。

自定义一个返回当前版本的接口，获取当前应用的版本:

// app.controller.ts
    // 导入 Post
    import {
         Controller, Get } from '@nestjs/common';
    import {
         AppService } from './app.service';
    
    @Controller()
    export class AppController {
        
      constructor(private readonly appService: AppService) {
        }
    
      @Get()
      getHello(): string {
        
        return this.appService.getHello();
      }
      // 自定义 getVersion 方法: 
      @Get('/version')
      getVersion(): Object {
        
        return this.appService.getVersion();
      }
      // 自定义 postIndex 方法: 
      @Post('/api')
      postIndex(): Object {
        
        return this.appService.getVersion();
      }
    }

在控制器文件 `src/app.controller.ts` 中:  
新增了一个使用`@Get`注解的`getVersion()`方法，可以通过Get访问，路由为“/version”。  
新增了一个使用`@Post`注解的`postIndex()`方法，可以通过Post访问, 路由为“/api”。

修改服务类文件 `app.service.ts`:

新增一个名为`getVersion()`的方法，返回 Object 格式的json数据。

// app.service.ts
    import {
         Injectable } from '@nestjs/common';
    
    @Injectable()
    export class AppService {
        
      getHello(): string {
        
        return 'Hello World!';
      }
      // 自定义：获取版本
      getVersion(): Object {
        
        return {
        
          code: 200, 
          msg: "OK",
          data: {
        
            version:"0.0.1"
          }, 
        }
      }
    }

使用 Control+C 结束终端运行，这次我们使用 `npm run start:dev` 启动(项目文件有修改会自动重启服务):

$ npm run start:dev  
    
    5:17:42 PM - Starting compilation in watch mode...
    [1] 
    [1] 
    [1] 5:17:44 PM - Found 0 errors. Watching for file changes.
    [0][nodemon] 1.19.1
    [0][nodemon] to restart at any time, enter `rs`
    [0][nodemon] watching: /Users/wangtom/development/node/nest-app/dist/**/*
    [0][nodemon] starting `node dist/main`
    [0][Nest]3845-2019-06-13[NestFactory] Starting Nest application...
    [0][Nest]3845-2019-06-13[InstanceLoader] AppModule dependencies initialized +20ms
    [0][Nest]3845-2019-06-13[RoutesResolver] AppController {/}: +6ms
    [0][Nest]3845-2019-06-13[RouterExplorer] Mapped {/, GET} route +8ms
    [0][Nest]3845-2019-06-13[RouterExplorer] Mapped {/version, GET} route +2ms
    [0][Nest]3845-2019-06-13[RouterExplorer] Mapped {/api, POST} route +2ms
    [0][Nest]3845-2019-06-13[NestApplication] Nest application successfully started +4ms
     ...

现在我们使用 `curl` 命令分别来请求这几个路由地址:

请求 “localhost:3000/version”:

$ curl localhost:3000            
    Hello World!% 
    # 默认GET请求'/version': 存在，返回预期的结果
    $ curl localhost:3000/version
    {"code":200,"msg":"OK","data":{"version":"0.0.1"}}%                                                   
    
    # 改成POST请求'/version': 不存在，框架自带的错误提示
    $ curl -X POST localhost:3000/version    
    {"statusCode":404,"error":"Not Found","message":"Cannot POST /version"}%

请求 “localhost:3000/api”:

# 使用POST请求'/api': 存在，返回预期的结果
    $ curl -X POST localhost:3000/api
    {"code":200,"msg":"OK","data":{"version":"0.0.1"}}% 
    
    # 改成GET请求'/api': 不存在，框架自带的错误提示
    $ curl localhost:3000/api 
    {"statusCode":404,"error":"Not Found","message":"Cannot GET /api"}%

### References ###

[https://docs.nestjs.com/first-steps][https_docs.nestjs.com_first-steps]

### Change log ###

2018.12.18 add this page, nestjs version 5.7.  
2019.06.13 update nestjs 6.5.

> 感谢阅读，如有问题请留言。

\[END\]

[https_docs.nestjs.com_first-steps]: https://docs.nestjs.com/first-steps