javascript - Vue/Webpack：根据条件将 CSS 拆分为 2 个文件

Question

我有一个 .vue 文件中包含 SCSS 的 Vue 项目。我需要将一些组件的样式编译到名为 global.css 的 CSS 文件中，并将其余部分编译到另一个文件中（我们称之为 default.css）。

我希望能够轻松地决定哪些组件样式去哪里并且正在考虑使用这样的东西，如果它甚至可能的话：

<style lang="scss" global>
/* SCSS goes here */
</style>

所以基本上我正在尝试找到一种使用global关键字拆分样式的方法。如果一个组件有 global 关键字，它的样式应该进入 global.css，否则进入 default.css。

这甚至可能吗？我是在做一些超级复杂的事情吗？如果是这样，关于我如何以另一种方式实现这一目标的任何其他想法？

标签： javascriptcssvue.jswebpackvue-loader