必须加在projects→[项目名]→architect→build→options→styles数组中，路径相对于angular.json所在目录，顺序决定CSS层叠优先级，加错位置会导致ng build后样式丢失。
必须加在 angular.json 的 projects → [项目名] → architect → build → options → styles 数组里，加错位置会导致 ng build 后样式彻底丢失。
styles 数组该加在哪一级配置里
只认这一条路径：projects → [你的项目名] → architect → build → options → styles。这个数组被 ng build、ng serve、ng test 共同读取——改这里才真正全局生效。
常见错误：
- 写在
architect.serve.options.styles：本地ng serve看得见，但ng build --prod后样式全空 - 写在
projects根下或cli/version层：JSON 解析直接忽略，无报错但无效 - 写在某个
configurations（如production）内部：除非你明确要按环境差异化引入，否则样式只在对应环境生效
路径怎么写才不 404
所有路径都相对于 angular.json 所在目录（即项目根目录），不是 src/，也不是组件目录。
立即学习“前端免费学习笔记（深入）”；
正确示例：
"node_modules/bootstrap-icons/font/bootstrap-icons.css""src/assets/styles/reset.scss"
错误示例：
Comprehensive Three.js 3D graphics reference
下载
详细的 Three.js 3D 图形参考，涵盖场景设置、相机、几何体、材质、光照、动画、控制器、加载器、数学工具和调试。
-
"assets/styles/reset.scss"（缺src/，构建时报File not found） -
"~/styles/reset.css"（不支持 TypeScript 别名） -
"/src/styles.css"（绝对路径不识别） -
"node_modules\bootstrap\dist\css\bootstrap.min.css"（Windows 下也必须用/，不能用\）
顺序为什么影响最终效果
styles 数组的顺序 = CSS 层叠优先级顺序。靠前的规则会被靠后的同名规则覆盖，和 HTML 中 <link> 加载顺序完全一致。
推荐顺序：
- 重置类（如
minireset.css） - 框架类（如
bootstrap.css或@angular/material主题） - 项目自定义
styles.css或theme.scss
如果发现按钮颜色没变，先打开浏览器开发者工具的 Computed 面板，看是哪条规则赢了；大概率是自定义样式写在了框架样式前面，被后者覆盖。
加了但组件里还是没生效？检查这几点
Angular 默认启用 ViewEncapsulation.Emulated，它会把组件样式局部化，而 styles 数组引入的是全局样式——两者不冲突，但容易误判“没生效”。
排查要点：
- 修改
angular.json后必须重启ng serve，热更新不会监听该文件 - 浏览器可能缓存旧的
styles.css，强制刷新（Ctrl+Shift+R）或禁用缓存调试 - 检查
<head>是否已注入对应<style>或<link>标签 - 确认选择器是否足够具体，比如
button可能被app-header button覆盖；可临时加!important验证（上线前务必删掉） - 如果用了
ViewEncapsulation.ShadowDom，全局样式默认不穿透，需改用 CSS 自定义属性或手动穿透（不推荐::ng-deep）
最常被忽略的一点：路径基准是 angular.json 所在目录，不是 src/，也不是你当前编辑的组件目录——写错一个 src/ 就直接 404，且构建时报错不明显。
