Vue CLI工程Webpack基本用法详解
webpack 的核心是它的配置文件webpack.config.js，它可以把项目构建的脏活累活全包了。你只要一份配置，整个构建流程就跑起来了，像以前折腾Grunt、Gulp那种麻烦事，基本不用再碰了。
脚手架 vue-cli 工程用的是基于 webpack 的构建方案，配置也不算复杂。其实你只要理解清楚几个核心点，比如入口entry、输出output、模块module这些，就可以开始撸自己的项目了，响应也快，调试也方便。
vue-cli里默认的 webpack 配置已经比较全了，像热更新、babel 转译、CSS 模块化都配好了。你只要跑一下npm run serve，就能直接看到效果，开发体验还是蛮不错的。
，随着项目变复杂，你需要自己加些 loader 或者 plugin，比如MiniCssExtractPlugin来拆 CSS、DefinePlugin注入环境变量。别担心，一开始先搞懂基础配置就够了，后面再扩展也不迟。
建议你先读读这篇Vue-cli webpack 快速构建项目，上手快，还结合了实际场景，比较适合前期摸索。还有这篇vue-cli 脚手架中 webpack 配置详解，讲得更细，适合慢慢啃。
如果你刚开始接触 webpack，不用急着把所有配置都搞懂，先跑起来项目，理解每个配置做了啥，比死啃文档强多了。
文件大小：77.97KB
评论区