webpack——安装及工作原理

来自慕课网https://www.imooc.com/video/1... webpack深入与实战 视频总结。

安装方法

1. 建立工程目录 mkdir projectName
2. 进入工程目录 npm init
3. 安装：npm install webpack --save-dev

简单使用：

1. 新建一个js文件：hello.js

   

2. webpack hello.js hello.bundle.js
   打包输出说明：Asset:打包文件名称 Size：文件大小 Chunks： 打包块 Chunk Names：打包块名称
   

   hello.bundle.js：
   

3. 新建world.js
   
4. 在hello.js中引用world.js
   
5. webpack hello.js hello.bundle.js 打包
   

   hello.bundle.js如下：
   将模块编号为：【0】 【1】 在模块0中__webpack_require__(1)
   

webpack命令行常用参数：

--module-bind css文件绑定用style-loader!css-loader 处理， 
--progress 查看打包进度
--display-modules 展示所有模块
--display-reason 展示模块打包原因
--watch 检测文件修改后自动打包
--config webpack.dev.config.js 重新配置webpack的文件名