css - 如何使模块 css 在 gatsby 应用程序中与 typescript 一起使用?

标签 css typescript gatsby

我有一个 GastbyJS 应用程序,我正在尝试在其上添加 typescript 。我解决了大部分问题,但我无法让 css 模块使用它。

我的文件中有这个导入,效果很好:import styles from "./card.module.css"
但是当我添加 typescript 配置时,它说 Cannot find module './card.module.css'.ts(2307)
我尝试使用一些 gatsby 插件,但它们没有按预期工作。

完整代码在这里:github

最佳答案

我遇到了同样的问题,在尝试了所有各种插件后,我遇到了这个对我有用的解决方案。

创建一个 css.d.ts 文件:

declare module '*.css' {
    const content: { [className: string]: string };
    export default content;
}

将这些行添加到您的 tsconfig.json 文件中:
"esModuleInterop": true,
"files": ["./src/typings/css.d.ts"]

"file"路径需要匹配您的类型定义文件所在的位置。

https://github.com/thetrevorharmon/gatsby-starter-typescript-sass/issues/1#issuecomment-436748732

关于css - 如何使模块 css 在 gatsby 应用程序中与 typescript 一起使用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61378768/

相关文章:

javascript - React const 中的目标片段

javascript - 在 html5 中围绕中心轴旋转内容

javascript - 滚动 : change opacity (from 0 to 1 and vv) of div when at a specific position on page

jquery - "Microsoft JScript runtime error: ' $ ' is undefined"使用 Typescript 和 jQuery 时

gatsby - 如何使用 Gatsby + Netlify CMS 正确提供国际化

javascript - Gatsby 中的类型错误 : Cannot read property 'data' of undefined . ...src/pages/index.js

java - 从本地文件在 JEditorPane 中设置背景图像

php - 如何将谷歌自动完成整个 div 移动到另一个 div

Angular 5 RouterLink 不适用于相同的路径但不同的参数

node.js - Typescript 版本不更新