Subscribe on changes!

css中 :global() 出错

avatar
Sep 7th 2021

Version

3.2.9

Reproduction link

new-issue.vuejs.org/

Steps to reproduce

<style lang="scss" scoped>
:global(.slide-menu-popover) {
  background-color:red;
  .el-menu {
    font-size:15px;
  }
}
</style>

What is expected?

<style type="text/css">
.slide-menu-popover{
    background-color:red;
}
.slide-menu-popover .el-menu{
    font-size:15px;
}
</style>

What is actually happening?

<style type="text/css">
.slide-menu-popover{
    background-color:red;
}
.slide-menu-popover{
    //全部放到  slide-menu-popover里面了
    font-size:15px;
}
</style>
avatar
Sep 7th 2021

it's :global(.slide-menu-popover .el-menu). Check https://github.com/vuejs/vue-next/blob/master/packages/compiler-sfc/__tests__/compileStyle.spec.ts#L117.

Please, next time consider using the forum, the Discord server or StackOverflow for questions first. But feel free to come back and open an issue if it turns out to be a bug 🙂