diff --git a/packages/compiler-sfc/__tests__/compileStyle.spec.ts b/packages/compiler-sfc/__tests__/compileStyle.spec.ts
index 8e5db0704cf..a343fe6b6fa 100644
--- a/packages/compiler-sfc/__tests__/compileStyle.spec.ts
+++ b/packages/compiler-sfc/__tests__/compileStyle.spec.ts
@@ -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
diff --git a/packages/compiler-sfc/src/stylePluginScoped.ts b/packages/compiler-sfc/src/stylePluginScoped.ts
index 87c8795cd79..c4576009495 100644
--- a/packages/compiler-sfc/src/stylePluginScoped.ts
+++ b/packages/compiler-sfc/src/stylePluginScoped.ts
@@ -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)