概念
webpack是前端模块化打包工具。
一、安装及使用
webpack为了能够正常运行，必须依赖node环境，node环境为了可以正常地执行很多代码，其中必须包含各种依赖的包，而npm工具是为了管理其中的各种包。
1.1安装node（本文不赘述）
查询电脑node版本
1.2安装webpack
全局安装webpack（本文安装版本为3.6.0）
安装指令：npm install webpack@3.6.0 -g
"@"后数字代表版本，也可不指定版本，会安装最新版
"-g"代表全局安装（终端里使用时，都是用的全局安装的webpack），对应的"--save-dev"代表局部安装
安装完成后需要配置环境变量：
电脑环境变量
二、基本使用
当js文件中使用了模块化的方式进行开发时，如果在index.html调用，浏览器是不会识别其中的模块化代码的，此外，实际项目中存在大量js文件，依次调用过于繁琐也不便管理。这时，我们就需要使用webpack来对文件进行打包
打包指令：webpack 需要打包的文件路径 打包后的文件路径
ps：4.0以上版本为 webpack 需要打包的文件路径 -o 打包后的文件路径
例：webpack ./src/main.js ./dist/bundle.js
打包路径
main.js
mathUtil.js
info.js
命令中虽然只打包了main.js，但webpack会自动将他需要的文件自动打包到目标文件中
文件打包完成后，直接在html中引用这一个文件即可
网友评论