vue + iview + webpack项目在ie浏览器中不能正常运行。
主要缘由是代码中使用es6语法,在低版本浏览器中没法识别。vue
解决办法:
(1)webpack不会编译static下的js文件,因此js文件不要写在static文件夹中;
(2)vue2+Webpack+ES6 兼容低版本浏览器 安装 "babel-polyfill"webpack
命令:npm install --save-dev babel-polyfill 在根目录main.js文件引入:import 'babel-polyfill' 在build文件夹下找到webpack.base.conf.js文件 entry: { app: ["babel-polyfill", "./src/main.js"] }
(3)安装依赖一个插件解决ES6/ES7高级语法兼容es6
npm install --save-dev babel-preset-es2015-ie 在根目录下.babelrc文件夹中: { "presets": [ // env项是借助插件babel-preset-env,下面这个配置说的是babel对es6,es7,es8进行转码,而且设置amd,commonjs这样的模块化文件,不进行转码 ["env", { "modules": false, "targets": { "browsers": ["> 1%", "last 2 versions", "not ie <= 8"] } }], // 下面这个是不一样阶段出现的es语法,包含不一样的转码插件 "stage-2" ], // 下面这个选项是引用插件来处理代码的转换,transform-runtime用来处理全局函数和优化babel编译 "plugins": ["transform-runtime"] }
(4)webpack-dev-server官方放弃了旧版浏览器的支持,把版本回滚到 webpack-dev-server@2.7.1web
npm uninstall webpack-dev-server npm install webpack-dev-server@2.7.1 --save-dev
(5)重点来了,在使用iview时尽可能使用全局安装,不要按需加载,IE浏览器不少问题都是iview按需加载的锅npm