Question

在遵循Angular-cli文档时，包含为global-styles的所有样式最终都会在创建DOM时注入文档的<head>。考虑到通常全局样式可以包含许多代码行，我试图理解注入是否适用于大型系统设计的webapps。

我可以看到在第一次加载时在<head>中使用样式的好处。但后续负载会发生什么？浏览器不会缓存内联或<head>样式，这使外部CSS文件成为更好的选择：下载一次，从那时开始从缓存加载。 Angular的方法导致在每个新页面加载时加载样式（从JS有效）。

或者我错过了什么？也许是因为<head>样式是从JS渲染的，并且由于Angular的文件是自己下载和缓存的，所以样式实际上也是缓存的？

Answer 1

你说的几乎所有内容都是正确的，这就是为什么angular-cli可以选择将css提取到css文件中，而不是js

--extract-css (Boolean) Extract css from global styles onto css files instead of js ones.
  aliases: -ec, --extractCss

所以你可以像这样使用它：

ng build -ec