🎉Awesome Vue-Cli3 ExamplE ：基于 Vue-Cli3 搭建的开箱即用 Vue 脚手架模版， 致力于探究更高效地构建优质 Web 应用。
功能详述
Vue-Cli3：对 Babel、TypeScript、ESLint、PostCSS、PWA、单元测试和 End-to-end 测试提供开箱即用的支持。
此脚手架：基于 Vue-Cli3 所构建，延续早先 vue-boilerplate-template 项目所倡导，旨在探究更高效地构建优质 Web 应用（推荐阅读开箱即用的 Vue Webpack 脚手架模版）；为此，有作以下工作：
- ✓ 注入并配置Vue-router，使得构建单页面应用 (SPA) 变得易如反掌；
- ✓ 注入并配置Vuex，以方便处理应用程序开发的状态管理；
- ✓ 引入Element-ui，以便快速搭建网站，而无需过多关注 UI ；
- ✓ 引入Axios并做封装，使得更优雅处理 Http 请求；
- ✓ 引入Dayjs，使得以更小的代价，处理日期时间相关；
- ✓ 引入marked插件，并做封装，使得可以充作富文本编辑器；同时亦可借助它的解析功能，实现
Markdown来绘制页面； - ✓ 基于 Webepack 4.* 新增特性，作了优化，详见
vue.config.js； - ✓ 开启 & 运用Jest对组件做单元测试，并附以 Demo 示例；
- ✓ 集成Prettier插件并做配置，促使团队写出更好且风格一致的代码，具体参见使用 ESLint ＆ Prettier 美化 Vue 代码；
- ✓ 注入 prerender-spa-plugin插件，使得在单页面应用程序中预呈现静态 HTML，优化 SEO 以及首屏渲染。
- ✓ 注入 webpack-bundle-analyzer插件，使得运行
yarn analyz，即可直观得到构建包内容，以助优化；详情参见：Webpack 打包优化之体积篇 - ✓ 注入size-plugin插件，使得在构建应用之时，可打印 Webpack 资产的 gzip 大小，以及自上次构建以来的变更;
- ✓ 将此脚手架，结合 Node.js(Koa2) Nginx MondoDb Redis，汇融入于 Docker，使 Front-End Developer 可轻松构建整个 Web 应用（目前已开源在 docker-vue-node-nginx-mongodb-redis）;
- ✗ 优化内置
Icon(Svg) 组件，使可以接收不同方式输入，并将 Svg 提取至单独文件中，以避免资源重复加载；
更详尽的描述可参见：Awesome Vue-Cli3 ExamplE。
1
Select Language