初始化
执行npm init命令
初始化之后,文件夹中会自动生成一个package.json文件
安装webpakc和webpack-cli
全局安装执行npm install webpack webpack-cli -g命令
npm install webpack webpack-cli -g
本地安装执行npm install webpack webpack-cli -D命令
安装之后会项目会自动生成node_modules和package-lock.json文件
测试
在项目中创建src文件夹,并在src文件夹中创建index.js,写上测试代码
function add(a,b){
return a+b;
}
console.log(add(1,3))
执行打包命令:
开发环境指令: webpack ./src/index.js -o ./build/main.js --mode=development
解释:webpack 会以./src/index.js 为入口文件开始打包,打包后输出到./build/main.js。整体打包环境为开发环境
生产环境指令: webpack ./src/index.js -o ./build/main.js --mode=production
解释:webpack 会以./src/index.js 为入口文件开始打包,打包后输出到./build/main.js
整体打包环境为生产环境
执行命令之后就可以看到生成了输出文件
运行打包后的资源
执行 node命令运行打包后的资源
可以看到输出了a+b的结果4