关于vue项目优化个人小记

vue项目的编译优化和打包优化是一个不可避免的问题，下面是小记录。

1.在生产环境中，我们路由中的组件引用方式应该是 import

(module.exports = file => () => import('@/pages/' + file + '.vue') )

在开发过程中，我们的组件引用方式应该用require (module.exports = file => require('@/pages/' + file + '.vue').default )  ->首屏加载速度变快很多，但是体积变大

路由中的引用方式应该是这样   const _import = require('./_import_' + process.env.NODE_ENV)    ->  主要取决于环境是dev还是pro

//  component: resolve => require(['@/components/HelloWorld'], resolve)

2.在prod.config.js 中把sourceMap选项设置为false。这里建议去了解一下关于sourceMap的作用

3.用工具压缩css

4.不建议的方式

<script src="//cdn.bootcss.com/vue/2.2.5/vue.min.js"></script>

<script src="//cdn.bootcss.com/vue-router/2.3.0/vue-router.min.js"></script>

<script src="//cdn.bootcss.com/vuex/2.2.1/vuex.min.js"></script>

<script src="//cdn.bootcss.com/axios/0.15.3/axios.min.js"></script>

目前本人只收集了这么些，有补充请发本人邮箱  15158614067@163.com

***在引用组件的时候，按需引用 像这样 import Button from 'vue-weui/components/button/button.vue';

 

2018-02-06-------------------------------------------------------------------------------------------------------------记录

下面是一个项目编译加速的插件。。。。。一闪一闪亮晶晶，亮瞎我的眼，直接看下面

首先 : cnpm i webpack-parallel-uglify-plugin -D

new ParallelUglifyPlugin({
    cacheDir: '.cache/',
    uglifyJS:{
       output: {
         comments: false
        },
        compress: {
            warnings: false
        }
    }
}),