在ReactJS+中加载CSS模块；键入脚本并重新布线

我正在使用ReactJS和typescript创建一个概念验证项目的初始设置，我希望在其中包含CSS模块，而不必弹出网页包配置

以下是我迄今为止遵循的步骤：

• npm安装-g创建反应应用程序
• 创建react app firstapp--scripts version=react scripts ts
• npm安装react应用程序重新布线--保存开发
• npm安装--保存开发代码Bandits/react应用程序重新布线css模块sass加载程序节点sass
• package.json： “开始”：“react应用程序重新布线开始--脚本版本react脚本ts”
• config-overrides.js：
  const-rewireCssModules=require（'react-app-rewire-css-modules'）； module.exports=函数重写（配置，环境）{ config=rewireCssModules（配置，环境）；
  返回配置；}

我正确设置了App.module.scss文件，并在App.tsx文件中引用了该文件：

从“/App.module.scss”导入样式

当我运行该项目时，我遇到了一个关于css模块的错误： 找不到模块'./App.module.scss'

当我在没有typescript配置的情况下执行完全相同的项目时，它仍然可以工作

要考虑CSS模块，我应该做哪些更改

我是为css模块加载器进行打字的，但我不确定如何将其集成到我的配置中，因为我没有弹出网页包配置

提前感谢,

托马斯·T

编辑1: 我添加了一个global.d.ts文件，其中包含：

• 声明模块'*.css'

• 声明模块'*.scss'

它成功了。最后，我没有为css模块加载程序使用打字

---

答案来自本文：

我添加了一个global.d.ts文件，其中包含：

• 声明模块'*.css'
• 声明模块'*.scss'

它成功了。最后，我没有为css模块加载程序使用打字

答案来自这篇文章：

---

我会在两天内接受这个答案。

在谷歌搜索了很多次之后，我找到了解决办法。我不熟悉react js，并尝试使用typescript进行构建，因此我找到了解决方案并开始使用

反应脚本

包裹。但是当我开始使用css模块时，遇到了从“/button.css”导入类的问题，所以我使用了“/button.css”导入“/button.css”，但是在这一过程中出现了很多css冲突，较高的组件范围css总是被较低的组件覆盖。所以谷歌搜索了很多，终于找到了解决方案

解决方案 从2.1开始创建支持typescript的react应用程序，以便将应用程序转换为上面的2.1

1.create new application using `npx create-react-app my-new-app --typescript`
2. replace your old src folder in new solution
3. Rename all your css file with `*.module.css` and change the import based on that.
4. Add your package dependancy if anything missing
5. Run

资料来源：