fix(compiler-sfc): scope Id should not be attached to @keyframe breakpoint rules (#3308)

fix #3304
This commit is contained in:
HcySunYang 2021-03-19 22:32:30 +08:00 committed by GitHub
parent 9717756a28
commit 6cb94752b0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 11 additions and 4 deletions

View File

@ -215,8 +215,10 @@ describe('SFC scoped CSS', () => {
expect(style).toContain(
`.anim-multiple-2[data-v-test] {\n animation-name: color-test,opacity-test;`
)
expect(style).toContain(`@keyframes opacity-test {`)
expect(style).toContain(`@-webkit-keyframes opacity-test {`)
expect(style).toContain(`@keyframes opacity-test {\nfrom { opacity: 0;`)
expect(style).toContain(
`@-webkit-keyframes opacity-test {\nfrom { opacity: 0;`
)
})
// vue-loader/#1370

View File

@ -1,4 +1,4 @@
import { PluginCreator, Rule } from 'postcss'
import { PluginCreator, Rule, AtRule } from 'postcss'
import selectorParser from 'postcss-selector-parser'
import { warn } from './warn'
@ -62,7 +62,12 @@ const scopedPlugin: PluginCreator<string> = (id = '') => {
const processedRules = new WeakSet<Rule>()
function processRule(id: string, rule: Rule) {
if (processedRules.has(rule)) {
if (
processedRules.has(rule) ||
(rule.parent &&
rule.parent.type === 'atrule' &&
/-?keyframes$/.test((rule.parent as AtRule).name))
) {
return
}
processedRules.add(rule)