描述问题

示例src/stories/Page.tsx组件顶部包含以下内容：

import React from 'react';

import { Header } from './Header';
import './page.css';

page.css的内容如下：

section {
  font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 24px;
  padding: 48px 20px;
  margin: 0 auto;
  max-width: 600px;
  color: #333;
}

section h2 {
  font-weight: 700;
  font-size: 32px;
  line-height: 1;
  margin: 0 0 4px;
  display: inline-block;
  vertical-align: top;
}
// Omitted for brevity

我刚刚注意到，我自己使用<section>的组件的故事也采用了这些样式：
头部：

受影响的组件：

我可以直接删除这些示例，一切就会恢复正常。这不是一个高优先级的问题。不过这确实引发了一个问题，为什么需要这样做呢？难道初始导入不能是一个有作用域的page.module.css吗？这样就可以避免将来删除对新开发者有用的文档。

重现问题

有趣的是，我无法通过基本的stack blitz来重现这个问题，即使点击到Page再返回到ComponentA也没有效果。但在我的本地环境中是可靠的。

系统信息

Environment Info:

  System:
    OS: macOS 13.4
    CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
  Binaries:
    Node: 18.13.0 - /usr/local/bin/node
    Yarn: 1.22.19 - ~/.yarn/bin/yarn
    npm: 9.5.1 - /usr/local/bin/npm
  Browsers:
    Chrome: 115.0.5790.170
    Safari: 16.5
  npmPackages:
    @storybook/addon-essentials: ^7.2.1 => 7.2.1 
    @storybook/addon-interactions: ^7.2.1 => 7.2.1 
    @storybook/addon-links: ^7.2.1 => 7.2.1 
    @storybook/blocks: ^7.2.1 => 7.2.1 
    @storybook/react: ^7.2.1 => 7.2.1 
    @storybook/react-vite: ^7.2.1 => 7.2.1 
    @storybook/testing-library: ^0.2.0 => 0.2.0