Vue IE 兼容问题解决

发表于 | 更新于 | 评论数： | 阅读次数：

问题描述

　　IE浏览器访问Vue项目，总是报如下错误：

1
2
3
4
5
6
7
8
9
10
let MockStorage;
// @ts-ignore
{
    MockStorage = class {            // <= 总是在这里报错
        get length() {
            return Object.keys(this).length;
        }
        ...
    }
}

解决办法

　　起初，在百度上搜，搜了很久都没有收到任何能够解决的办法；果断换Google，一次搜到解决办法。这次是血的教训，浪费了我这么多时间，以后还是老老实实用Google吧。
　　解决办法：把package.json里面的 vuex-persist 这个包的版本改成1.8.0，然后再npm install。
　　问题是 vuex 数据持久化的包版本太高导致的。

　　Github Issues 传送门

2019.7.5 补充

　　文档其实已经写得很清楚了，不是只有降级的办法，我只是还没养成仔细读文档的习惯，[手动狗头]

When using with Webpack (or Vue CLI 3), the esm file gets used by default. If your project has a es6 or es2015 target, you’re good, but if for backwards compatibility, you are compiling your project to es5 then this module also needs to be transpiled.

To enable transpilation of this module

1
2
3
4
5
// in your vue.config.js
module.exports = {
  /* ... other config ... */
  transpileDependencies: ['vuex-persist']
}

2019.8.1 补充

　　如果是 vue-cli2:在build/webpack.base.conf.js 中 添加

1
2
3
4
5
6
7
8
9
10
{
  test: /\.js$/,
  loader: 'babel-loader?cacheDirectory',
  include: [
    resolve('src'),
    resolve('test'),
    resolve('node_modules/webpack-dev-server/client'),
    resolve('node_modules/vuex-persist')
  ]
}
0%