vue 首屏優化

首屏優化主要思想是經過 分包加載,減小 app.js 的體積來達到 快速加載的目的,本文主要採用 webpack 的 externals 配合 cdn 實現的首屏優化html

  1. 配置 webpack vue

configureWebpack:{
       externals: { 
      'vue': 'Vue', // vue 是 npm 包對應的名字,Vue 是你在項目中使用的變量名
      'vuex': 'Vuex',
      'axios': 'axios',
      'element-ui': 'ELEMENT'
    }
}

  2. index.html 換上cdnwebpack

 

 

 

 

使用cdn 最好鎖定版本,以避免更新帶來沒必要要的困擾,我這裏使用的 bootcdn,固然,也能夠下載至本地ios

3. 這也是最爲關鍵的一步,將使用 impot 引入,而且在 exteranls 註冊的npm 包註釋,以下web

 

  在項目中 直接使用 Vue Vuex axios ELEMENT 即可vuex

ps: element-ui 在 exteranls 註冊後必須使用所有大寫,我也不知道爲啥,其次Vue.user() Vue.mixin() 使用會報錯npm

相關文章
相關標籤/搜索