解决vue项目兼容性问题,一般都会先npm install --save babel-polyfill,然后再main.js中引包import ‘babel-polyfill’,并进行相关配置。
但是有的时候即使已经引入babel-polyfill依赖包后也会出现一些特殊的情况。比如在ie11上能够正常显示,但是用ie10或ie9中项目却打不开,并且报语法错误,可能报错如下图:
这时我们点击测试环境的错误会进入到一个错误定位的地方,如下图:
研究之后会发现,在match.mjs这个依赖包里存在es6语法,导致插件没有生效。这时候我们就需要转换语法。这时我们自己在本地依赖包中修改代码,本地打开项目,项目就正常可以在ie9和ie10中正常打开,但发现,这种方式是不可行的,测试环境的打包的依赖是重新拉取的依赖包,这时候代码在服务器上运行还是报错的。
此时我们只能另寻一种办法,卸载这个依赖包,然后重写依赖包的方法,我们可以直接复制依赖包中的代码到一个js文件中,然后将文件中的es6语法改为es5语法,之后再将引入matchit依赖包的文件中引入的地址变为自己重写的文件地址即可。大致步骤分为:
1、复制报错依赖包文件代码(node_modules/matchit/lib/matchit.mjs)
2、新建js文件,粘贴代码,修改es6语法
3、修改引入地址
4、卸载报错依赖包, 执行命令 npm uninstall matchit,
5、执行命令npm run dev重启项目,此时可能还会报错,原因是卸载matchit时也卸载了另 外一个包(@arr/every),按提示在安装一下这个包,再重新启动项目就可以了;
如果是本地代码在ie10中打不开代码,此时是定位在报错地方,会给出报错文件。