为什么新建Angular项目中已配置的Bootstrap样式无法生效

• 核心问题为angular.json中的样式路径配置错误：你填写的路径开头多了根路径标识/，会导致Angular从系统根目录寻址资源而非项目根目录，将路径修改为以下内容即可：

"styles": [
  "node_modules/bootstrap/dist/css/bootstrap.css",
  "src/styles.css"
],

• 修改angular.json配置后不会触发热更新，必须停止当前运行的ng serve进程，重新启动开发服务后新配置才会生效
• 额外可排查点：确认你使用的Bootstrap类名和安装的Bootstrap版本匹配，Bootstrap 3、4、5大版本之间存在大量类名差异，版本不匹配也会导致样式不生效
• 可选替代方案：你也可以不用修改angular.json，直接在项目默认的src/styles.css全局样式文件中添加导入语句@import "bootstrap/dist/css/bootstrap.css"，效果和修改angular.json一致

内容的提问来源于stack exchange，提问作者Marshall Munoz