核心图
直接上代码吧
https://github.com/duanshanghanqing/imooc-test-berners
https://github.com/duanshanghanqing/berners-cli
Node项目如何支持ES Module
方案一: webpack + bable-loader
安装模块
npm i -D babel-loader @babel/core @babel/preset-env
npm i -D @babel/plugin-transform-runtime
npm i -D @babel/runtime-corejs3
创建webpack.config.js
const path = require('path');
module.exports = {
entry: './bin/core.js',
output: {
path: path.join(__dirname, '/dist'),
filename: 'core.js'
},
mode: 'development',
target: 'node', // 默认是 web 环境
// 以上四步完成后就可以支持es module
// 还想要支持低版本的node, 就需要配置babel-loader转义
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-env'],
plugins: [
[
'@babel/plugin-transform-runtime',
{
corejs: 3,
regenerator: true,
useESModules: true,
helpers: true
}
]
]
}
}
}
]
}
}
方案二: Node原生支持ES Module
这种方案的实现,所有文件必须以.mjs结尾。文件内必须以ES Module的方式导出或引用
1.创建index.mjs文件
2.node版本小于14 node --experimental-modules index.mjs
3.node版本大于14 node index.mjs
本周作业完成情况
绘制脚手架架构设计图(已完成)
实现脚手架准备过程代码(已完成)
通过 commander 实现一个脚手架,包含自定义 option 和 command 功能:imooc-test-berners(已完成)
通过 webpack 和原生两种方式实现 Node 对 ES Module 的支持(已完成)