我可以使用Vue.js组件避免重复样式吗?

时间:2017-12-12 11:27:31

标签: vue.js vue-component sass-loader

我是Vue的新手(以及单个文件组件的概念),并且不确定在生成应用程序时如何编译CSS。

我有一个模式库,其中所有SCSS都是为我的项目编译的,所以我想把它拉到我的组件中。我知道我可以全局加载mixins和变量,然后我打算在挑选其他的sass块时,如果需要使用它来设置该组件的样式。

我担心的是:

如果我在多个组件中继续使用相同的样式定义,这些是否会在已编译的css中重复?

如果是这样的话。怎么可以避免?例如: 我导入了' headings.scss' 10个组件。是否有10个实例' headings.scss'编译好的CSS中的文件?

我希望这是有道理的!这里需要更清晰一点。

1 个答案:

答案 0 :(得分:4)

是的,会有重复。但是,如果您使用的是vuejs webpack 模板,那么生成版本的css将由cssnano处理,这会丢弃重复的css

注意; 只会丢弃完全重复的内容。