做好了的项目,放自己测试服务器上速度还挺快,所以当时也没想那么多,后来放到公司服务器上,才发现慢的一批,后来想到应该是要进行优化,
首先,将所有未压缩的资源,通通压缩一遍,试一下,快了一点点,但还是比较慢,属于那种忍受不了的速度。
然后想到使用cdn以减少rendor.js的容量。
首先,在index.html页面中引入js时使用cdn引入
<div id="app"></div>
<!--开发环境-->
<!-- <script src="https://cdn.bootcss.com/vue/2.5.10/vue.js"></script> -->
<!--生产环境-->
<script src="https://cdn.bootcss.com/vue/2.5.10/vue.min.js"></script>
<script src="https://cdn.bootcss.com/element-ui/2.4.0/index.js"></script>
<!-- <script src="https://cdn.bootcss.com/vuex/3.0.1/vuex.js"></script> -->
<script src="https://cdn.bootcss.com/axios/0.18.0/axios.min.js"></script>
然后在build文件夹下的webpack.base.conf.js文件下externals对象中添加如下代码
externals: {
'BMap': 'BMap',
'vue': 'Vue',
'element-ui':'element-ui',
// 'vuex': 'Vuex',
'axios': 'axios',
},
最后在main.js中,引入方式进行改变一下
import Vue from 'vue'
import App from './App'
import router from './router'
// import Element from 'element-ui'
import paging from './components'
import has from '@/assets/js/btnPermission.js';
Vue.prototype.$ELEMENT = { size: 'small' };
Vue.prototype.$axios = axios;
Vue.config.productionTip = false