fix(uniapp): 修复 notifications.vue 中样式未声明 scss 导致微信开发工具 wxss 嵌套报错

pwuniapp/pages/user/notifications.vue

@@ -218,7 +218,7 @@ onShow(() => {
 });
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 /* 颜色全部取自全局主题变量（App.vue 按 theme-warm 覆盖），随主题切换自动适配 */
 /* 导航栏规范与其它页面一致：总高=安全区，内容行贴底对齐胶囊，标题绝对居中 */
 .notif-page {
@@ -395,74 +395,74 @@ onShow(() => {
   background:
     radial-gradient(110% 38% at 50% -6%, rgba(99, 102, 241, 0.12), transparent 62%),
     var(--surface-0);
+}
 
-  .custom-nav-bar {
-    background: rgba(7, 11, 20, 0.88);
-    backdrop-filter: blur(18px);
-    border-bottom-color: rgba(255, 255, 255, 0.05);
-  }
+.notif-page .custom-nav-bar {
+  background: rgba(7, 11, 20, 0.88);
+  backdrop-filter: blur(18px);
+  border-bottom-color: rgba(255, 255, 255, 0.05);
+}
 
-  .notif-summary {
-    background: linear-gradient(145deg, rgba(24, 34, 58, 0.88) 0%, rgba(13, 20, 36, 0.92) 100%);
-    border-color: var(--hairline);
-    box-shadow: 0 12rpx 28rpx rgba(0, 0, 0, 0.16);
-  }
+.notif-page .notif-summary {
+  background: linear-gradient(145deg, rgba(24, 34, 58, 0.88) 0%, rgba(13, 20, 36, 0.92) 100%);
+  border-color: var(--hairline);
+  box-shadow: 0 12rpx 28rpx rgba(0, 0, 0, 0.16);
+}
 
-  .notif-card {
-    background: rgba(15, 22, 38, 0.78);
-    border-color: var(--hairline);
-    border-radius: 16px;
-    box-shadow: 0 10rpx 24rpx rgba(0, 0, 0, 0.12);
+.notif-page .notif-card {
+  background: rgba(15, 22, 38, 0.78);
+  border-color: var(--hairline);
+  border-radius: 16px;
+  box-shadow: 0 10rpx 24rpx rgba(0, 0, 0, 0.12);
+}
 
-    &.is-unread {
-      background: linear-gradient(145deg, rgba(30, 41, 66, 0.92) 0%, rgba(18, 27, 46, 0.94) 100%);
-      border-color: rgba(129, 140, 248, 0.22);
-    }
+.notif-page .notif-card.is-unread {
+  background: linear-gradient(145deg, rgba(30, 41, 66, 0.92) 0%, rgba(18, 27, 46, 0.94) 100%);
+  border-color: rgba(129, 140, 248, 0.22);
+}
 
-    .notif-title {
-      font-size: 14px;
-      letter-spacing: 0.2rpx;
-    }
+.notif-page .notif-card .notif-title {
+  font-size: 14px;
+  letter-spacing: 0.2rpx;
+}
 
-    .notif-content {
-      color: #A7B3CB;
-    }
-  }
+.notif-page .notif-card .notif-content {
+  color: #A7B3CB;
+}
 
-  .notif-dot {
-    box-shadow: 0 0 10rpx rgba(255, 95, 87, 0.45);
-  }
+.notif-page .notif-dot {
+  box-shadow: 0 0 10rpx rgba(255, 95, 87, 0.45);
 }
 
 .notif-page.theme-warm {
   background:
     radial-gradient(100% 36% at 50% -6%, rgba(234, 88, 12, 0.06), transparent 62%),
     #FDFBF7;
+}
 
-  .custom-nav-bar {
-    background: rgba(253, 251, 247, 0.92);
-    border-bottom-color: #F0ECE4;
-  }
+.notif-page.theme-warm .custom-nav-bar {
+  background: rgba(253, 251, 247, 0.92);
+  border-bottom-color: #F0ECE4;
+}
 
-  .notif-summary {
-    background: #FFFFFF;
-    border-color: #F0ECE4;
-    box-shadow: 0 12rpx 28rpx rgba(28, 25, 23, 0.05);
-  }
+.notif-page.theme-warm .notif-summary {
+  background: #FFFFFF;
+  border-color: #F0ECE4;
+  box-shadow: 0 12rpx 28rpx rgba(28, 25, 23, 0.05);
+}
 
-  .notif-card {
-    background: #FFFFFF;
-    border-color: #F0ECE4;
-    box-shadow: 0 10rpx 24rpx rgba(28, 25, 23, 0.04);
+.notif-page.theme-warm .notif-card {
+  background: #FFFFFF;
+  border-color: #F0ECE4;
+  box-shadow: 0 10rpx 24rpx rgba(28, 25, 23, 0.04);
+}
 
-    &.is-unread {
-      background: #FFFDF8;
-      border-color: #FED7AA;
-    }
+.notif-page.theme-warm .notif-card.is-unread {
+  background: #FFFDF8;
+  border-color: #FED7AA;
+}
 
-    .notif-content {
-      color: #78716C;
-    }
-  }
+.notif-page.theme-warm .notif-card .notif-content {
+  color: #78716C;
 }
 </style>

server/tests/miniapp-script-syntax.spec.ts

@@ -35,4 +35,39 @@ describe('第九十七批小程序脚本语法闸门', () => {
     }
     expect(problems).toEqual([]);
   });
+
+  it('未声明 lang="scss" 的 <style> 中不得出现嵌套选择器，杜绝微信 WXSS unexpected { 编译报错', () => {
+    const problems: string[] = [];
+    for (const file of walk(root, [])) {
+      const src = fs.readFileSync(file, 'utf-8');
+      const styleMatches = src.matchAll(/<style([^>]*)>([\s\S]*?)<\/style>/g);
+      for (const m of styleMatches) {
+        const attrs = m[1] || '';
+        if (/lang\s*=\s*["']scss["']/.test(attrs)) continue;
+        const body = m[2];
+        const lines = body.split('\n');
+        let depth = 0;
+        let inAtRule = false;
+        for (let i = 0; i < lines.length; i++) {
+          const line = lines[i].trim();
+          if (line.startsWith('@keyframes') || line.startsWith('@media')) {
+            inAtRule = true;
+          }
+          for (const ch of line) {
+            if (ch === '{') {
+              depth++;
+              if (depth > 1 && !inAtRule) {
+                problems.push(`${path.relative(root, file)}: line ${i + 1}`);
+                break;
+              }
+            } else if (ch === '}') {
+              depth = Math.max(0, depth - 1);
+              if (depth === 0) inAtRule = false;
+            }
+          }
+        }
+      }
+    }
+    expect(problems).toEqual([]);
+  });
 });