第一步：在项目中安装webpack 和 webpack-cli 模块
npm i -D webpack webpack-cli
第二步：定义entry和output属性
const path = require('path');
module.exports = {
mode: 'production',
entry:'./bin/test.js',
target: 'node',
output: {
path: path.join(__dirname, './dist'),
filename: 'test.js',
libraryTarget: 'commonjs2',
libraryExport: 'default'
}
};
配置文件关键点：
• mode：development / production，development模式打包后的代码不会压缩，production打包后的代码是压缩好的
• target: 这个配置默认是'web'，当我们使用默认值打包我们的node项目时，可能会出现下面这种问题：
上面的图告诉我们找不到fs这个库，使用node进行开发的小伙伴都知道，fs属于node的内置库，理论上不可能找不到！但正是由于我们的target属性的值是‘web’才导致了这样的错误，要解决这个问题我们将target设置为‘node’即可！！！
• libraryTarget：这是定义最终打包出来的文件使用的模块化规范，选择commonjs2说明只是在node环境使用。如果要兼容所有模式就要设置为‘umd’；
• libraryExport：很多小伙伴打完包后，发现导出后的内容多了一个default属性，原因就在于webpack会自动将ES6里的export default转为了exports.default，所以打包后导出的内容多了一个default属性。webpack可以通过libraryExport配置暴露（导出）的模块，我们只要将libraryExport设置为default即可！
第三步：配置babel，兼容不同版本的node
当我们在代码中使用了像async / await这种高版本的语法时，如果不使用babel，打包以后的代码是这样的：
这些代码在低版本的node下运行是会报错的！为了让我们的项目能在不同的node版本下运行，所以我们还是需要引入babel来对代码做一个兼容性处理！
接下来我们讲讲如何借助babel-loader对代码进行转换：
第一步：先安装相关依赖
npm i -D @babel/core @babel/preset-env babel-loader
第二步：添加webpack配置
entry:'./bin/test.js',
...
module: {
rules: [
{
test:/\.js$/, // 匹配js文件
exclude:/(node_modules|dist)/, // 排除一些不需要转换的文件
use: {
loader:'babel-loader',
options: { // 替代.babelrc文件
presets: ['@babel/preset-env']
}
}
}
]
}
重新打包以后，我们可以看到代码有了变化：
加了babel-loader以后并没有万事大吉，重新运行打包后的文件，出现了以下错误：
regeneratorRuntime这个是babel在代码转换的时候，加的一个垫片方法。以上这错误是使用babel时经常遇到的问题，那应该怎么去解决这个问题呢？
第一步：安装一个库babel插件
npm i -D @babel/plugin-transform-runtime @babel/runtime-corejs3
第二步：添加babel 配置
options: { // 替代.babelrc文件
presets: ['@babel/preset-env'],
plugins: [
[
'@babel/plugin-transform-runtime',
{
corejs:3, // 使用的corejs版本是3，所以需要在第一步中安装@babel/runtime-corejs3模块
regenerator:true
}
]
]
}
完成了这些，我们终于配置好了babel！！！经过上面一系列的配置以后，我们的node项目就可以完美支持ES Module了。
