angular12项目对IE浏览器的支持

725 阅读1分钟

官网对于支持的浏览器做出的说明:angular12 v12.angular.io/guide/brows…

angular12支持IE1,但默认不开启

angualar将不再对IE浏览器进行支持,并逐步进行移除,在angular12项目有发出预警,angular12将废弃对IE11的支持,在angular13将彻底移除。但可以在12版本的浏览器支持列表中看到IE11,着说明12版本还是支持IE11的

c343b1f8eee30e24b115e98fe9974ac.png

2021年统计的出用户ie11浏览器使用占比仅有1%

aaa3f7cc343054e5bf798c2deed593a.png

angular12依然支持IE11,但是默认配置是不开启对IE11的支持的

c375a2a8523b9043ae0af1cef34007d.png

查看支持浏览器(npx browserslist )

angular cli 使用github.com/browserslis…

npx browserslist 在项目下运行可查看支持浏览器

c4b140bbdd00ed06b4325c75056b587.png

angular12如何支持IE11

默认不支持IE11

我们新建的angular12空项目,查看支持的浏览器列表,发现其中没有IE11 be0b1559c67654fa524e0747d6d970b.png

我们来看一下效果:

在360浏览器极速模式,访问项目,正常

c8d4c8e4a0c84f7b4f6ae944e154af6.png

在360浏览器兼容模式(IE11)模式下,访问项目,异常空白页面,并且控制台看不到任何报错信息

b9c10f43d183f86bcabf6e95442e5d7.png

配置支持IE11

修改.brwoserslistrc文件

打开项目的  .brwoserslistrc文件,如下:

1645172674(1).jpg

可以看到配置文件有注明,IE11支持是一个可选项,当要选择支持IE11时就将not去掉

not IE 11改成 IE 11

然后在运行 npx browserslist 可以看到列表有IE11了

1645172699(1).jpg

修改tsconfig.json文件

将target值改为es5 ,使得编译后JavaScript的版本为es5,这样在ie11上能兼容运行

1645172728(1).jpg

其他几个配置含义可参见如下

image.png