vue + elementUI 项目首屏速度优化

vue+elementUI项目打包后，首页加载时间较长，有很多方面值得深入研究、优化的地方，主要从以下二个方面着手：

1，element-ui 按需引入

（1）首先执行： 

npm install babel-plugin-component -D

（2）然后在babelrc中的plugins配置：

[
      "component",
      {
        "libraryName": "element-ui",
        "styleLibraryName": "theme-chalk"
      }
    ],

（3）在main.js里配置：

import { Button} from 'element-ui';

Vue.component(Button.name, Button);

 

2，vue-router 路由懒加载

（1）首先执行：

npm install babel-plugin-syntax-dynamic-import -D

（2）然后在babelrc中的plugins配置：

"syntax-dynamic-import"

（3）改写router.config.js里的路由：

const Login = () => import('./components/Login.vue');

export default [
  {
    name:'login',
    path:'/login',
    component:Login
  }
]

 

转载于:https://www.cnblogs.com/easonw/p/9203858.html