vue-loader
vue-loader copied to clipboard
vuejs
sub component lost style (without data-v-xxxxxxxx attribute ) when I use style scoped
Version
15.10.0
Reproduction link
Steps to reproduce
<template>
Please see the reproduction link above for details
</template>
<script>
export default {
name: "VuetifyDemo",
data: () => ({
show: false,
}),
};
</script>
<style scoped src="vuetify/dist/vuetify.min.css">
</style>
<style lang="stylus" scoped></style>
What is expected?
Components can be displayed normally when I import without using global styles. I am using vuetify to complete some functions of vuepress, but reset.css is included in vuetify.min.css, I don't want them to affect other styles, so I choose partial import.
What is actually happening?
When component is rendered, v-img (.v-image div) has no data-v-xxxxxxxx attribute. When I remove the scoped setting, it displays fine, but it also means that other styles of vuepress are polluted.
When I manually add the data-v-xxxxxxxx attribute in the browser developer tools, the display is normal, now I want to know how to achieve it by code
