一、全局安装webpack、webpack-cli
cnpm i webpack webpack-cli -g
注:最好在管理员的模式下操作。
二、在你要的文件夹下创建要的webpack文件夹
mkdir demo1
三、本地安装webpack、webpack-cli
cnpm i webpack webpack-cli --save-dev
四、在你创建的demo1文件夹下创建src文件夹,里面放置的是你的html、js、json等文件。
//src/index.js
import data from "./data.json"
function fn1() {
console.log("fn1")
console.log(data);
}
fn1()
//src/data.json
{
"study": "computer"
}
五、在demo1下执行
1.开发环境:
webpack ./src/index.js -o ./dist/bundle.js --mode=development
2.生产环境:
webpack ./src/index.js -o ./dist/bundle.js --mode=production
实现index到bundle的打包转换。
六、创建一个html文件引入刚刚打包好的bundle.js文件即可。