Javascript Vue.js样式表资源

我最近发现了Vue.js。 我将它与单文件组件体系结构一起使用，我注意到所有组件的样式都加载到页面中（即使是那些不活动的）

---

有没有办法只加载当前组件的CSS并避免代码重复？

您可以使用

作用域属性使样式仅应用于当前元素：

<style scoped>
  .class{
    //will only apply to this component
  }
</style>


.类{
//将仅适用于此组件
}
网页将显示您所有的源代码（即使它们的范围已确定）

CSS跨所有组件提取到单个文件中，并使用cssnano缩小

我真的看不到需要将CSS拆分为单独文件的用例。
我已经测试过了，但是使用“scoped”将属性添加到目标组件的主HTML元素中，scoped样式使用此属性进行选择。但是，如果组件不处于活动状态，它仍然加载在同一页面上。就像@Cohars所说的，我认为一个缩小的CSS文件最适合你的应用程序。每次加载新组件时，通过HTTP请求加载CSS并不是最佳解决方案。为什么要一直加载和卸载CSS？您是否担心渲染性能？