到目前为止，我们的现在都是在开发环境下编写代码，那么项目真正编写完毕之后，就需要部署到生产环境中。
那么项目开发完成之后，需要使用webpack对项目进行打包发布，主要原因有以下两点：
①开发环境下，打包生成的文件存放于内存中，无法获取到最终打包生成的文件
②开发环境下，打包生成的文件不会进行代码压缩和性能优化
为了让项目能够在生产环境中高性能的运行，因此需要对项目进行打包发布，只有这样，我们才能拿到最终打包好的项目文件。
二、配置在项目的描述文件package.json文件的scripts节点下，新增一个命令：build。
三、把js文件统一生成到js目录中在webpack.config.js配置文件的output节点中，进行如下的配置：
四、把图片文件统一生成到image目录中修改webpack.config.js中的url-loader配置项，新增outputPath选项即可指定图片文件的输出路径：
五、思考一个问题以前说过，我们的css也会放在单独的一个css文件夹中，这些个说法其实是站在编写源码的角度是没有问题的，现在打包好之后，已经看到了js文件放在了js文件夹中，图片放在了image文件夹中了，那么是不是应该css文件也应该放在css文件夹中呢？
确实是的，但是真正打包之后，发现并没有，原因是：我们并没有配置，而且也不需要配置，原因是：对于我们的css，我们借助的是style-loader这样的加载器，这种加载器其实是把css的样式直接定义在了网页中，也就是内部样式表或者是内联样式表的形式作用于元素的，而不是通过外部样式表的形式存在。
那么对于样式这块，其实就不用做额外的配置了。
六、打包测试打包命令：npmrunbuild。
会发现：在dist目录下有一个index.html文件。这个文件是生成就是靠html-webpack-plugin插件实现的。
七、自动清理dist目录下的旧文件的两种方式7.1、说明为了在每次打包发布时自动清理掉dist目录中的旧文件，这样就不用每次删除dist目录再重新发布了。做法有两种：
可以安装并配置clean-webpack-plugin插件
配置clean选项
购买专栏解锁剩余19%