在react JS Typescript中加载CSS模块并重新布线react

Question

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

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

>

npm安装-g创建-反应-app

创建-反应-应用程序firstapp-脚本-版本=反应-脚本-ts

npm安装react-app-重新连线-保存-dev

npm安装-保存-开发代码块/react-app-rewire-css-模块sass加载节点sass

package.json："start"："react-app-rewire start--crips-version react-crips-ts"

config-overrides.js：

const-rewireCssModules=require（'react-app-rewire-css-modules'）；单元exports=函数重写（config，env）{config=rewireCssModules（config，env）；
返回配置；}

我正确设置了我的应用程序。单元scss文件，并在我的应用程序中引用了它。tsx文件：

从'导入样式。/App.module.scss'；

当我运行这个项目时，我有一个关于css模块的错误：找不到模块'/应用程序。单元scss’。

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

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

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

提前感谢,，

托马斯。T

编辑1：我添加了一个global.d.ts文件：

>

声明模块“*”。scss'

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

答案来自本文：https://hackernoon.com/zero-config-react-typescript-css-modules-jest-with-poi-bbcedfe2383a

Answer 1

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

脚本

包裹但当我开始使用css模块时，遇到了“从导入类”的问题/按钮css“不起作用，所以我使用导入”/按钮但是在这种情况下有很多css冲突，较高的组件范围css总是被较低的组件覆盖。所以谷歌搜索了很多，终于找到了解决方案。

来自2.1 create react应用程序的解决方案支持typescript，因此将您的应用程序转换为上面的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

来源：https://joshblog.net/2018/upgrading-a-react-and-typescript-app-from-react-scripts-ts-to-create-react-app-v2-1/

Answer 2

我添加了一个global.d.ts文件：

• 声明模块“*”。css'
• 声明模块“*”。scss'

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

答案来自本文：https://hackernoon.com/zero-config-react-typescript-css-modules-jest-with-poi-bbcedfe2383a

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