Vue+Webpack多页面脚手架
基 webpack 的 Vue 多页面脚手架，适合不想被 Vue CLI 绑手绑脚，又想玩得灵活点的开发者。你可以自己控制多个入口、多个页面，还能顺手加各种 loader 和插件，搭起来虽然稍微麻烦点，但一旦上手，后面扩展就方便。
多页面配置用得比较多，比如后台管理系统、营销落地页，或者那种有独立模块的大型网站。每个页面搞一个entry，再用HtmlWebpackPlugin去生成对应的index.html，脚本自动注入，基本不用你手动维护。
Vue Loader是整个.vue 组件打包的关键，记得要搭配vue-template-compiler。不然打包直接报错你都找不出是哪段出问题。样式那块，用style-loader和css-loader配合，加个postcss和autoprefixer，老浏览器都能跑。
资源这块，图片、字体统一用file-loader或者url-loader搞定，路径好管，部署也省事。公共代码拆出来放vendors或common，用的是SplitChunksPlugin，加载更快、缓存更友好。
开发环境开启HMR，你改个样式都不用刷新页面，效率蹭蹭的。还有source-map调试起来也方便。环境变量分开发/生产配置，加个DefinePlugin就行，记得写死成字符串哦，不然编译不通过。
部署时跑一下npm run build，脚本里会把代码压缩、优化，打包到dist目录，直接扔服务器就完事。如果你想搭个自己的项目模板，这个脚手架蛮适合二次开发的。
如果你对 Vue 多页面感兴趣，可以看看Vue 多页面应用实例和Vue Webpack 多页面构建示例这两篇文章，配合上手会更快。
文件大小：21.01KB
评论区