1.使用路由懒加载1.安装插件npminstall--save-dev@babel/plugin-syntax-dynamic-import2.修改babel.config.js文件module.exports={presets:['@vue/app'],"plugins":[['@babel/plugin-syntax-dynamic-import']]}3.vue.config.js添加如下配置，取消prefetch和preloadchainWebpack(config){config.plugins.delete('preload')config.plugins.delete('prefetch')}2.压缩资源文件（vue前端打包chunk-vendors文件太大）1.安装插件（指定版本为@5.0.1，版本太高会报错：Cannotreadproperty'tapPromise'ofundefined)npmicompression-webpack-plugin@5.0.12。修改vue.config.jsconstwebpack=require('webpack')constCompressionWebpackPlugin=require('compression-webpack-plugin')constproductionGzipExtensions=['js','css']constisProduction=process.env.VUE_APP_ENV_NAME==='production'module.exports={configureWebpack:{plugins:[newCompressionWebpackPlugin({algorithm:'gzip',test:/\.(js|css|less)$/,//匹配文件名threshold:10240,//压缩超过10k的数据minRatio:0.8,//deleteOriginalAssets:true//删除源文件})],},}3.后端配置nginx#gzipconfiggzipon;gzip_min_length1k;gzip_comp_level9;gzip_types文本/普通应用程序/javascript应用程序/x-javascript文本/css应用程序/xml文本/javascript应用程序/x-httpd-php图像/jpeg图像/gif图像/png；gzip_vary开启；gzip_disable"MSIE[1-6]\.";服务器{听80;#gzip配置gzipon;gzip_min_length1k;gzip_comp_level9；gzip_types文本/普通应用程序/javascript应用程序/x-javascript文本/css应用程序/xml文本/javascript应用程序/x-httpd-php图像/jpeg图像/gif图像/png；gzip_vary开启；gzip_disable"MSIE[1-6]\.";根/usr/share/nginx/html；location/{#配合browserHistory使用try_files$uri$uri//index.html;#如果有资源，建议使用https+http2，按需加载可以获得更好的体验#重写^/(.*)$https://preview.pro.loacg.com/$1永久；}location/api{proxy_passhttps://preview.pro.loacg.com;proxy_set_headerX-Forwarded-Proto$scheme;proxy_set_header主机$http_host;proxy_set_headerX-Real-IP$remote_addr;}}server{#如果有资源，建议使用https+http2，配合按需加载体验更好listen443sslhttp2default_server;#公私证书Keyssl_certificate/path/to/public.crt;ssl_certificate_key/path/to/private.key;location/{#配合browserHistory使用try_files$uri$uri//index.html;}location/api{proxy_passhttps://preview.pro.loacg.com;proxy_set_headerX-Forwarded-Proto$scheme;proxy_set_header主机$http_host;proxy_set_headerX-Real-IP$remote_addr;}}
