vueCli3兼容IE10配置
1.安装
npm install babel-polyfill --save
npm install es6-promise --save
npm install url-search-params-polyfill --save
2.在main.js文件最上面加
import "babel-polyfill"; import "url-search-params-polyfill"; import Es6Promise from "es6-promise"; Es6Promise.polyfill();
3.package.json配置browserslist
"browserslist": [ "> 1%", "last 3 versions", "not ie <= 10" ]
4.postcss.config.js配置
module.exports = { plugins: { autoprefixer: { overrideBrowserslist: [ "Android 4.1", "iOS 7.1", "Chrome > 31", "ff > 31", "ie >= 8", "last 10 versions", // 所有主流浏览器最近10版本用 ], }, }, };
5.babel.config.js配置
module.exports = { presets: [ [ "@vue/cli-plugin-babel/preset", { useBuiltIns: "entry", polyfills: ["es6.promise", "es6.symbol"], }, ], ], };
6.配置vue.config.js
module.exports = { transpileDependencies: ["*"],//配置依赖转化,可定制配置 chainWebpack: (config) => { config.entry.app = ["babel-polyfill", "./src/main.js"]; } };
7.兼容css var()变量
// 安装依赖 npm install css-vars-ponyfill --save // 在main.js文件加入 import cssVars from "css-vars-ponyfill"; cssVars({});
有问题请指教补充改正。