Webstorm+;TypeScript无法解析CRA项目中的SCSS模块(错误TS2339)
我有一个createreact应用程序项目,目前正在从FlowJS迁移到TypeScript。当我将TypeScript集成到项目中时,WebStorm中出现的一个问题是TypeScript似乎无法解析来自SCSS模块导入的任何键。我总是受到以下方面的欢迎: 我的顶级样式导入是:Webstorm+;TypeScript无法解析CRA项目中的SCSS模块(错误TS2339),typescript,webstorm,create-react-app,Typescript,Webstorm,Create React App,我有一个createreact应用程序项目,目前正在从FlowJS迁移到TypeScript。当我将TypeScript集成到项目中时,WebStorm中出现的一个问题是TypeScript似乎无法解析来自SCSS模块导入的任何键。我总是受到以下方面的欢迎: 我的顶级样式导入是:从“/\u styles.module.scss”导入样式 为了解决这个问题,我做了大量的研究/挖掘,创建了一个src/global.d.ts文件,其中包含以下内容: declare module '*.scss' {
从“/\u styles.module.scss”导入样式
为了解决这个问题,我做了大量的研究/挖掘,创建了一个src/global.d.ts
文件,其中包含以下内容:
declare module '*.scss' {
const content: {
[className: string]: string;
}
export = content
}
尽管定义了上述模块,使缓存失效并重新启动WebStorm,但问题仍然存在——我不再知道要解决这个问题还需要尝试什么
我的TypeScript版本设置为“TypeScript”:“^3.8.3”
,在我的包.json中。这就是我的tsconfig.json
的样子:
{
"compilerOptions": {
"allowJs": false,
"allowSyntheticDefaultImports": true,
"baseUrl": "src",
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"isolatedModules": true,
"jsx": "react",
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"module": "esnext",
"moduleResolution": "node",
"noEmit": true,
"noImplicitAny": false,
"outDir": "./build",
"plugins": [
{ "name": "typescript-plugin-css-modules" }
],
"removeComments": true,
"resolveJsonModule": true,
"skipLibCheck": true,
"sourceMap": true,
"strict": true,
"target": "es5"
},
"include": [
"src/**/*.ts",
"src/**/*.tsx"
],
"exclude": ["node_modules"]
}
对此的任何帮助都将不胜感激。似乎typescript没有选择src/global.d.ts
中的定义,尝试将src文件夹添加为tsconfig.json
中的键入根文件夹,然后重新启动typescript
{
"compilerOptions": {
...
"typeRoots" : ["src", "node_modules/@types"]
}
}
更多详细信息:似乎typescript没有获取src/global.d.ts
中的定义,尝试将src文件夹添加为tsconfig.json
中的键入根文件夹,然后重新启动typescript
{
"compilerOptions": {
...
"typeRoots" : ["src", "node_modules/@types"]
}
}
更多详细信息:我不太喜欢您将src/
dir声明为typeRoot
的建议。如果您运行tsc--p tsconfig.json--listFiles
,是否列出了您的global.d.ts?@DavidBarker是的,它在我运行该命令时列出。好的,那么这不是类型脚本问题,可能特定于Webstorm。如果打开底部的typescript选项卡,左侧(顶部)有一个按钮,允许您使用特定的tsconfig.json重新编译项目。我会试试,如果不行,我会重新启动typescript服务。您的项目中有多少tsconfig.*.json
文件?报告问题的文件是否包含在任何文件中?@DavidBarker噢,我的天哪,它已修复!!!原来是typescript插件css模块
导致了我的问题!我从我的tsconfig.json
中删除了它,并卸载了该包,WebStorm不再抱怨我的关键引用!我甚至不需要安装@types/node-sass
。哦,老兄,我太高兴了!!我不太喜欢您将src/
dir声明为typeRoot
的建议。如果您运行tsc--p tsconfig.json--listFiles
,是否列出了您的global.d.ts?@DavidBarker是的,它在我运行该命令时列出。好的,那么这不是类型脚本问题,可能特定于Webstorm。如果打开底部的typescript选项卡,左侧(顶部)有一个按钮,允许您使用特定的tsconfig.json重新编译项目。我会试试,如果不行,我会重新启动typescript服务。您的项目中有多少tsconfig.*.json
文件?报告问题的文件是否包含在任何文件中?@DavidBarker噢,我的天哪,它已修复!!!原来是typescript插件css模块
导致了我的问题!我从我的tsconfig.json
中删除了它,并卸载了该包,WebStorm不再抱怨我的关键引用!我甚至不需要安装@types/node-sass
。哦,老兄,我太高兴了!!刚刚添加了这个,无效缓存并重新启动WebStorm--不幸的是,它没有工作。Typescript正在识别您的文件,删除这个,它不是必需的。刚刚添加了这个,无效缓存并重新启动WebStorm--不幸的是,它没有工作。Typescript正在识别您的文件,删除这个,它不是必需的。