搭建步驟
nestjs環(huán)境以及腳手架的搭建可以參考我第一篇文章:
nestjs學習筆記(一)環(huán)境搭建與模式粗略分析
在完成nest的初次搭建后病瞳,為了便于我們開發(fā),通常我們需要使用熱重載舰攒。
這里是簡單的使用wepback進行熱重載的辦法。
進入你的nestjs工程目錄:
$ npm i --save-dev webpack webpack-cli webpack-node-externals
安裝所需webpack依賴痊银。
在項目根目錄建立webpack.config.js,將以下配置code復制進去
(注:使用nestjs腳手架的情況下直接可以使用宵蕉,如果程序入口文件不同, 請更改下面代碼的entry第二個參數(shù))
const webpack = require('webpack');
const path = require('path');
const nodeExternals = require('webpack-node-externals');
module.exports = {
entry: ['webpack/hot/poll?100', './src/main.ts'],
watch: true,
target: 'node',
externals: [
nodeExternals({
whitelist: ['webpack/hot/poll?100'],
}),
],
module: {
rules: [
{
test: /.tsx?$/,
use: 'ts-loader',
exclude: /node_modules/,
},
],
},
mode: 'development',
resolve: {
extensions: ['.tsx', '.ts', '.js'],
},
plugins: [new webpack.HotModuleReplacementPlugin()],
output: {
path: path.join(__dirname, 'dist'),
filename: 'server.js',
},
};
將這兩行代碼添加進package.json的scripts屬性下
"webpack": "webpack --config webpack.config.js",
"webpack-start": "node dist/server",
此外节榜,還需要在程序的入口文件(我的是src/main.ts) 下添加以下代碼:
import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';
declare const module: any;
// 引導程序
const bootstrap = async () => {
const app = await NestFactory.create(AppModule);
await app.listen(3000);
if (module.hot) {
module.hot.accept();
module.hot.dispose(() => app.close());
}
};
bootstrap();
大致就是判斷一下全局module對象中是否注入了hot對象羡玛,然后執(zhí)行熱重載。
好我們的配置工作結(jié)束宗苍。
運行步驟
打開一個窗口運行 npm run wepback
成功后打開第二個窗口運行 npm run webpack-start
image.png
得到對應提示說明熱更新啟動成功稼稿。
git的提交問題
因為使用webpack的熱重載會編譯出很多不需要提交的文件,我們在項目根目錄建立 .gitignore 文件用于忽略這部分的提交
# 這行是注釋
dist/
node_modules/
本文章參考了騰訊云文檔讳窟,點這里訪問原文