一直使用macOS系統(tǒng)下chrome瀏覽器下開發(fā)，僅僅使用到ant design pro vue 組件庫，默認(rèn)的腳手架配置。

客戶使用win7下360安全瀏覽器訪問，自動(dòng)變成”兼容“模式訪問，頁面很多地方變形的。

手動(dòng)切換極速模式就頁面奔潰無法打開。

vue配置文件如下！

babel.config.js

const IS_PROD = ['production', 'prod'].includes(process.env.NODE_ENV)const plugins = []if (IS_PROD) { plugins.push('transform-remove-console')}// lazy load ant-design-vue// if your use import on Demand, Use this codeplugins.push(['import', { 'libraryName': 'ant-design-vue', 'libraryDirectory': 'es', 'style': true // `style: true` 會(huì)加載 less 文件}])module.exports = { presets: [ '@vue/cli-plugin-babel/preset', [ '@babel/preset-env', { 'useBuiltIns': 'entry', 'corejs': 3 } ] ], plugins}

vue.config.js

const path = require('path')const webpack = require('webpack')const createThemeColorReplacerPlugin = require('./config/plugin.config')function resolve (dir) { return path.join(__dirname, dir)}const isProd = process.env.NODE_ENV === 'production'const assetsCDN = { // webpack build externals externals: { // vue: 'Vue', // 'vue-router': 'VueRouter', // vuex: 'Vuex', // axios: 'axios' }, css: [], // https://unpkg.com/browse/vue@2.6.10/ js: [ // '//cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.min.js', // '//cdn.jsdelivr.net/npm/vue-router@3.1.3/dist/vue-router.min.js', // '//cdn.jsdelivr.net/npm/vuex@3.1.1/dist/vuex.min.js', // '//cdn.jsdelivr.net/npm/axios@0.19.0/dist/axios.min.js' ]}// vue.config.jsconst vueConfig = { configureWebpack: { // webpack plugins plugins: [ // Ignore all locale files of moment.js new webpack.IgnorePlugin(/^./locale$/, /moment$/) ], // if prod, add externals externals: isProd ? assetsCDN.externals : {} }, chainWebpack: (config) => { config.resolve.alias .set('@$', resolve('src')) const svgRule = config.module.rule('svg') svgRule.uses.clear() svgRule .oneOf('inline') .resourceQuery(/inline/) .use('vue-svg-icon-loader') .loader('vue-svg-icon-loader') .end() .end() .oneOf('external') .use('file-loader') .loader('file-loader') .options({ name: 'assets/[name].[hash:8].[ext]' }) // if prod is on // assets require on cdn if (isProd) { config.plugin('html').tap(args => { args[0].cdn = assetsCDN return args }) } }, css: { loaderOptions: { less: { modifyVars: { // less vars，customize ant design theme 'primary-color': '#F5222D', 'link-color': '#F5222D' // 'border-radius-base': '4px' }, // DO NOT REMOVE THIS LINE javascriptEnabled: true } } }, devServer: { // development server port 8000 port: 8000 // If you want to turn on the proxy, please remove the mockjs /src/main.jsL11 // proxy: { // '/api': { // target: 'https://mock.ihx.me/mock/5baf3052f7da7e07e04a5116/antd-pro', // ws: false, // changeOrigin: true // } // } }, // disable source map in production productionSourceMap: false, lintOnSave: undefined, // babel-loader no-ignore node_modules/* transpileDependencies: []}// preview.pro.loacg.com only do not use in your production;if (process.env.VUE_APP_PREVIEW === 'true') { console.log('VUE_APP_PREVIEW', true) // add `ThemeColorReplacer` plugin to webpack plugins vueConfig.configureWebpack.plugins.push(createThemeColorReplacerPlugin())}module.exports = vueConfig

網(wǎng)傳Babel不行 ，需要PolyFill，開發(fā)依賴如下！

360極速模式切換也是坑？看網(wǎng)友文章

官方文檔真是無卵用

這是啥情況！雖然我不用國內(nèi)瀏覽器，但是用戶普遍都一樣，我的電腦win7下正常，用戶win7 win10也能出現(xiàn)各種問題。而webpack打包項(xiàng)目都是依靠依賴，很多事情我們自己能決定的情況就少了。

如果是用戶多的系統(tǒng)，最好還是不要使用現(xiàn)在五花八門的新技術(shù)，只適合少部分人使用的后臺(tái)開發(fā)。

創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來咯，堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)

總結(jié)

以上是生活随笔為你收集整理的vue使用npm不会自己加到plugins_Vue-cli项目，打包生产模式，部分用户360浏览器极速模式下奔溃...的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。