无法将 CSS 模块导入 React TypeScript 项目 #121

Question

描述错误在我的 React Typescript 项目中，我正在尝试使用 CSS 模块。 我使用create-react-app创建了项目，后来添加了 TypeScript。 然后我按照文档中的说明在项目中设置 CSS 模块

1. 添加了带有npm install -D typescript-plugin-css-modules
2. 然后更新了 tsconfig.json

{
  "compilerOptions": {
    "plugins": [{ "name": "typescript-plugin-css-modules" }]
  }
}

3. 我试图运行它，但它没有运行。 它在这里抱怨 import 声明。 虽然插件文档说它不应该
4. 所以我添加了global.d.ts ，它解决了错误
5. 现在当我运行它时，header 上的 Home 链接应该是白色的。 但我看到默认颜色

重现

1. Go 到https://codesandbox.io/s/summer-haze-ztnf6?file=/src/index.tsx
2. 查看链接主页

预期行为主页链接颜色应为白色

Answer 1

由于您已经解决了该问题，请查看描述： Problem in access the scss variables in react components

以类似的方式，您可以从模块 scss 文件中访问类。

Answer 2

没关系，将 scss 文件的名称更改为header.module.scss解决了这个问题。