ChineseEngineer / vue-cli3-optimization

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

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

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

About

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


Languages

Language:JavaScript 53.4%Language:Vue 35.0%Language:HTML 9.8%Language:CSS 1.8%