node后端项目使用webpack打包教程,target: “node“
node后端项目使用webpack打包教程
安装webpack webpack-cli
pnpm add webpack webpack-cli -D
webpack 能够为多种环境 或 target构建编辑。想要理解什么是
target
的详细信息。
taget string [string] false
告知 webpack 为目标(target)指定一个环境。默认值为browserslist
,如果没有找到browserslist
的配置,则默认为web
选项 | 描述 |
---|---|
async-node | 编译为类 Node.js 环境可用(使用 fs 和 vm 异步加载分块) |
electron-main | 编译为 Electron 主进程。 |
electron-renderer | 编译为 Electron 渲染进程, |
使用 JsonpTemplatePlugin,FunctionModulePlugin 来为浏览器环境提供目标,使用 NodeTargetPlugin 和 ExternalsPlugin | |
为 CommonJS 和 Electron 内置模块提供目标。 | |
electron-preload | 编译为 Electron 渲染进程, |
使用 NodeTemplatePlugin 且 asyncChunkLoading 设置为 true ,FunctionModulePlugin 来为浏览器提供目标,使用 NodeTargetPlugin 和 ExternalsPlugin 为 CommonJS 和 Electron 内置模块提供目标。 | |
node | 编译为类 Node.js 环境可用(使用 Node.js require 加载 chunks) |
node-webkit | 编译为 Webkit 可用,并且使用 jsonp 去加载分块。支持 Node.js 内置模块和 nw.gui |
导入(实验性质) | |
nwjs[[X].Y] | 等价于 node-webkit |
web | 编译为类浏览器环境里可用 (默认) |
webworker | 编译成一个 WebWorker |
esX | 编译为指定版本的 ECMAScript。例如,es5,es2020 |
browserslist | 从 browserslist-config 中推断出平台和 ES 特性 (如果 browserslist 可用,其值则为默认) |
创建webpack.conf.js配置文件
const path = require(path)
const nodeExternals = require("webpack-node-externals")
module.exports = {
target: "node",
entry: "./src/index.js",
ouptput: {
path: path.resolve(__dirname, "dist")
},
externals: [nodeExternals()],
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-env']
}
}
}
]
}
}
创建.babelrc
{
"preset":["@babel/preset-env"]
}
下载依赖
pnpm add babel @babel/preset-env webpack-node-externals -D
修改package.json
...
"scripts": {
...
"build": "webpack --mode production"
}
...
直接起飞
pnpm build
原文地址:https://blog.csdn.net/liangzhenmeng/article/details/140629881
免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!