I"m asking about scss files, not vue and js files.
at first I put all the styles in the same style.scss, in which I import a larger big.scss
//style.scss
@import "big.scss"
.other{...}then use this style.scss in many places and find that the typed css file is super large.
remove the big.scss and you will find that the typed css file is much smaller.
//style.scss
.other{...}-- 2019.1.14 br-
plus the style of the scoped attribute all have an identity attribute similar to data-v-0a679ea0, which causes css to be repeatedly packaged.
A.vue
<style lang="scss" scoped>
@import "../common.scss";
</style>B.vue
<style lang="scss" scoped>
@import "../common.scss";
</style>then I thought, I wish I didn"t write the css code of the public part in scoped
<style lang="scss">
@import "../common.scss";
</style>
<style lang="scss" scoped>
@import "../common.scss";
.input-container{
color:$grey
}run error report: Undefined variable: "$grey"
without scoped, there is some repetition of the previous class name, and then the style is messed up.
feels that this is a big bug.