xuhengfeng / vue-cli3-optimization

基于vue-cli@3的项目可行性优化方案探索

vue-cli3-optimization

基于 vue-cli@3 做的关于 CDN + Gzip + Prerender + Sass 的优化。在基于 vue-cli@2 的项目 vue-optimization 里已经对这些优化方案做了详细说明。你也可以阅读我的这篇博客。这个仓库旨在展示最终的优化结果，细节可以通过查看 git 历史了解，相应的地方也有详细注释。

注意！！！预渲染需要下载 Chromium ，而由于你懂的原因，谷歌的东西在国内无法下载，所以在根目录添加了.npmrc文件，来使用淘宝镜像下载。参考链接。如果你的终端可以翻到国外，直接忽略这一步,你也许会喜欢小飞机

使用 iView 的同学需要注意！！！在非 template/render 模式下（例如使用 CDN 引用时），组件名要分隔。例如 DatePicker 必须要写成 date-picker。部分组件，需要加前缀 i-。具体参考 iView 文档和此 ISSUE

创建时的预设，详情参见.vuerc，参考链接

{
  "packageManager": "npm",
  "useTaobaoRegistry": false,
  "presets": {
    "vue-optimization": {
      "useConfigFiles": true,
      "plugins": {
        "@vue/cli-plugin-babel": {},
        "@vue/cli-plugin-eslint": {
          "config": "standard",
          "lintOn": [
            "save"
          ]
        }
      },
      "router": true,
      "routerHistoryMode": true,
      "vuex": true,
      "cssPreprocessor": "sass"
    }
  }
}

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Run your tests

npm run test

Lints and fixes files

npm run lint