必须加在angular.json的projects..architect.build.options.styles中，因为该路径是cli构建流程唯一读取并打包注入的位置；其他位置如serve或configurations下仅局部生效或被忽略，且路径须以项目根目录为基准、带src/前缀、用正斜杠。

必须写在 angular.json 的 projects.<name>.architect.build.options.styles</name> 数组里，其他位置或写法在构建后大概率失效。

为什么只能加在 build.options.styles 里

Angular CLI 的构建流程（ng build、ng serve、ng test）只读取这个路径下的 styles 数组，并将其打包进主样式 bundle，最终注入到 。写错位置会导致“本地看着有，打包后全空”：

• architect.serve.options.styles → ng serve 能加载，但 ng build --prod 完全忽略
• 直接写在 projects 根级或 cli 字段下 → JSON 解析跳过，静默失效
• 塞进 configurations.production.styles → 只在加 --configuration=production 时生效

路径怎么写才不报 Can't resolve 或 File not found

所有路径都以 angular.json 所在目录（即项目根目录）为基准，不能用别名、不能加 ./、不能用反斜杠：

Wjs Uploading Video

将一个或多个视频上传至YouTube。当用户想“上传到YouTube”“发YouTube”“批量上传”“upload to YouTube”“post videos to YouTube”或发布到YouTube时使用此技能。

下载

• "src/styles.scss" ✅ 推荐，语义清晰，CLI 默认从 src/ 开始解析
• "node_modules/bootstrap-icons/font/bootstrap-icons.css" ✅ 正确引用第三方
• "./src/styles.scss" ❌ 报 Can't resolve './src/styles.scss'
• "styles.scss" ❌ 报 File not found（除非真把文件放项目根）
• "~/styles.scss" ❌ 不支持 TypeScript 别名
• "src\styles.scss" ❌ Windows 下也必须用 /，不能用 \

改了 angular.json 但样式没更新？先检查这三件事

90% 的“不生效”不是配置错，而是环境没同步：

• 重启 ng serve —— 它完全不监听 angular.json 变化
• 强制刷新页面（Ctrl+Shift+R）或开发者工具中勾选 Disable cache
• 打开开发者工具 → Elements → 任一元素 → Computed 面板，确认目标 CSS 规则是否被覆盖（顺序问题）

多个 CSS 文件的加载顺序影响谁赢

styles 数组的顺序 = 浏览器最终注入的 <link> 顺序 = CSS 层叠优先级顺序。同选择器、同特异性下，靠后的规则生效：

• 推荐顺序："src/assets/css/normalize.css" → "node_modules/bootstrap/dist/css/bootstrap.min.css" → "src/styles.scss"
• 如果 .btn-primary 颜色没变，大概率是自定义样式写在了 Bootstrap 前面，被后者覆盖
• 全局样式无法穿透 ViewEncapsulation.ShadowDom 组件，这点容易被忽略

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！