项目优化--进度条添加nprogress，ui界面依赖安装依赖，搜索nprogress安装，或者在终端安装npminprogress-S导入main.js中的进度条组件//importtheprogressbarplug-inimportNProgressfrom'nprogress'//导入进度条样式import'nprogress/nprogress.css'useNProgress.start()显示进度条（使用请求拦截器）NProgress.start()useNProgress.done()隐藏进度条（使用responseInterceptor）NProgress.done()移除打包的console（在babel.config.js中设置）安装babel-plugin-transform-remove-console在终端ibabel下载npm-plugin-transform-remove-console-S在plugins节点下添加"transform-remove-console"()"plugins":[["component",{"libraryName":"element-ui","styleLibraryName":"theme-chalk"}],//这是开发中禁止所有控制台输出的“transform-remove-console”dreleaseenvironments]仅在发布阶段移除控制台使用process.env.NODE_ENV判断当前版本是否为开发阶段varprodPlugins=[]if(process.env.NODE_ENV=='production'){prodPlugins.push('transform-remove-console')}使用展开运算符将数组中的插件交给plugins"plugins":[["component",{"libraryName":"element-ui","styleLibraryName":"主题粉笔”}],...prodPlugins]使用vue.config.js修改webpack的默认配置创建一个vue.config.js文件js内部暴露一个配置对象module.exports={//文件打包后，一个dist会生成文件夹index.html可以直接双击运行publicPath:'./',}自定义入口文件使用chainWebpack配置不同的环境，设置不同的入口文件module.exports={//文件打包后，将在dist文件夹中生成一个索引。html可以直接双击运行publicPath:'./',chainWebpack:config=>{//当前环境为release阶段config.when(process.env.NODE_ENV=='production',config=>{config.entry('app').clear().add('./src/main-prod.js')})//当前环境为开发阶段config.when(process.env.NODE_ENV=='development',config=>{config.entry('app').clear().add('./src/main-dev.js')})}}通过CDN加载外部资源（获取最近的服务器资源）因为入口文件通过import方式导入包，最终会打包到同一个js文件中，所以chunk-vendors文件太大。由于这些文件被打包成同一个js文件，体积太大，所以有些js文件被忽略不打包（只需要在发布阶段配置即可）//使用externals设置exclusions//填写config.set('externals',{vue:'Vue','vue-router':'VueRouter',releasemodevue.config.js中的axios:'axios',echarts:'echarts',nprogress:'NProgress','vue-quill-编辑器':'VueQuillEditor'})虽然忽略了一些js文件，但是入口文件中还有一些css文件比较大，所以直接删除导入的cssimportVueQuillEditorfrom'vue-quill-editor'//富文本editingimport'quill/dist/quill.core.css'import'quill/dist/quill.snow.css'import'quill/dist/quill.bubble.css'把上面的css去掉不打包，最终的样式肯定是有问题，所以引入cdn资源文件在publicindex.html
