vue项目性能优化策略

vue项目性能优化策略

1.按需引入

2.导入‘element’类似组件时，不要整个导入使用，只需要导入使用的组件

图片的压缩合并

雪碧图(精灵图),在ps中保存的图片的时候按需调整保存格式

3.压缩代码

new webpack.optimize.UglifyJsPlugin({
   
  compress: {
   
    warnings: false,
    drop_console: true,
    pure_funcs: ['console.log']
  },
  sourceMap: false
})
vue3.0中时在vue.config中
productionSourceMap: false,
//其中sourceMap: false是禁用除错功能。
//如果设为true，在部署包中会生成.map结尾的js文件。它用于在代码混淆压缩的情况下仍可进行调试。
//这个功能虽好，但会大大增加整体