例如,如果我的组件中有这样的东西:
<style lang="scss" scoped>
.color-blue {
color: blue;
}
.orange-blue {
@extend .color-blue; // This works!
@extend .bg-orange; // .bg-orange is defined in another css file somewhere. This doens't work
}
</style>
我收到一个错误提示".orange-blue" failed to @extend ".bg-orange".
The selector ".bg-orange" was not found.
我读过我可以添加
@import 'path/to/orange.css'
到我的样式块,但这在这里似乎不起作用。另外,这不会导致每个导入它的组件都重复使用 CSS 吗?
最佳答案
使用其他样式导入文件
<style lang="scss" scoped>
@import '~styles/mixins';
...
</style>
或使用通常的路径
@import '../../../styles/mixins';
关于vue.js - 如何在 Vue 组件中@extend 外部 CSS 类?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55184007/