Angular学习笔记90: 浏览器兼容性问题

简单记录一下，对于Angular16中，面对低版本的浏览器，快速解决兼容性问题的方案

添加浏览器和node版本的配置文件

1. 添加文件.browserslistrc
   执行命令：

ng generate config browserslist

2. 修改文件内容：

# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.  
# For additional information regarding the format and rule options, please see:  
# https://github.com/browserslist/browserslist#queries  
  
# For the full list of supported browsers by the Angular framework, please see:  
# https://angular.io/guide/browser-support  
  
# You can see what browsers were selected by your queries by running:  
#   npx browserslist  
  
last 45 Chrome versions  
last 10 Firefox version  
last 10 Edge major versions  
last 2 Safari major versions  
last 2 iOS major versions  
Firefox ESR

添加腻子脚本

1. 安装兼容性所需要的依赖：

npm i --save @babel/polyfill classlist.js core-js web-animations-js

2. 配置
   在文件 angular.json中修改architect.build.options.polyfills 数组中添加

"core-js/es/symbol",  
"core-js/es/object",  
"core-js/es/function",  
"core-js/es/parse-int",  
"core-js/es/parse-float",  
"core-js/es/number",  
"core-js/es/math",  
"core-js/es/string",  
"core-js/es/date",  
"core-js/es/array",  
"core-js/es/regexp",  
"core-js/es/map",  
"core-js/es/set",  
"web-animations-js",  
"classList.js",  
"@babel/polyfill"