無法將 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解決了這個問題。