webpack手册-03-Output Management

Output Management

开始讲到output了

Preparation

先准备一下，添加了print.js，修改了之前的代码

修改了配置文件

可以关注下配置文件的修改和html的引用，entry入口修改为了两个，对应的output的filename也修改了按文件名导出bundle

构建没问题

效果也没问题，点击按钮，控制台输出

代码见：GitHub - uikoo9/webpack-guides at 0.1.1 

Setting up HtmlWebpackPlugin

终于讲到plugin了，看来看手册还是比直接看api文档要慢一些

安装htmlwebpackplugin，这个插件可以生成html文件，不用每次手动修改，

对应的修改一下配置文件

构建依旧没问题

看效果，dist下的index.html文件被修改，文件内容是单行输出的

代码见：GitHub - uikoo9/webpack-guides at 0.1.2 

Cleaning up the /dist folder

终于可以清理dist文件夹了，也可以把dist加入.gitignore文件中进行忽略，webpack会自动生成dist文件夹的内容，不用维护。

修改配置文件，添加clean属性，每次构建时会清空dist文件夹

构建没问题

看效果，dist文件夹内的文件被清空重新生成了，对比上一个图明显少了很多

代码见：https://github.com/uikoo9/webpack-guides/tree/0.1.3