reactjs 无法找到模块'functions'. ts(2307)

t1qtbnec  于 2023-03-29  发布在  React
关注(0)|答案(9)|浏览(142)

我正在尝试使用TypeScript创建一个react应用程序。我确实创建了react-app(name)--use-pnp --typescript。
TS linter一直说Cannot find module 'react'. ts(2307)我试过yarn add @types/react,yarn add,restarting VScode等等。

import React, { Component } from 'react';
import './App.css';

interface IAppState {
}

interface IAppProps {
}

class App extends React.Component<IAppProps, IAppState> {
  constructor(props: IAppState) {
  super(props);
  this.state = {
  };
  }

  render() {
    return (
      <div className='App'>
        <h1>Image classification with ML5.js</h1>
      </div>
    );
  }
}

export default App;

我的软件包. json

{
  "name": "image-recognition",
  "version": "0.1.0",
  "private": true,
  "installConfig": {
    "pnp": true
  },
  "dependencies": {
    "@types/jest": "24.0.13",
    "@types/node": "12.0.2",
    "@types/react": "^16.8.17",
    "@types/react-dom": "^16.8.4",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-scripts": "3.0.1",
    "typescript": "3.4.5"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

我的tsconfig.json:

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "preserve"
  },
  "include": [
    "src"
  ]
}

我试过yarn add @types/react,yarn add,重启VScode等等。

np8igboo

np8igboo1#

**解决方案:**我不得不手动更改应该使用哪个TS版本编辑器(VSC)。说明如下(2021年1月工作)。

在我的例子中,这个错误是由于Visual Studio Code使用的是全局/默认TypeScript版本,而不是工作区/项目版本。这很重要,因为linter/编辑器没有选择tsconfig.json,它定义了模块应该如何解析。
这是VSC中的剥绒错误:

这里的答案是缺少react模块,但在我的情况下,它是我的本地模块--尽管如此,错误代码是相同的,这个解决方案在某些情况下可能会有所帮助。
要在Visual Studio Code中更改TS版本,您可以单击编辑器窗口底部的版本(屏幕截图中的4.1.2):

选择选项“选择TypeScript版本...”:

然后选择“使用工作区版本”:

这样做之后,错误就消失了。
我的tsconfig.json供参考:

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "baseUrl": ".",
    "strictNullChecks": true,
    "noImplicitThis": true,
    "allowJs": true,
    "skipLibCheck": true,
    "strict": false,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve"
  },
  "include": [
    "next-env.d.ts",
    "**/*.ts",
    "**/*.tsx"
  ],
  "exclude": [
    "node_modules"
  ]
}
tpgth1q7

tpgth1q72#

我也遇到了同样的问题,发现这个s/o问题没有答案。我想我会分享我的解决方案。也许对你来说也是一样的。如果不是,也许它可以帮助其他人:
对我来说,奇怪的是,这是因为我没有正确安装React,或者它是过时的东西。
要在VS 2019中修复此问题:(以管理员身份运行)
菜单:工具-〉命令行-〉PowerShell

npm install @types/react

(不像你)我也有一个缺少package.json文件的问题,但我有一个package-lock.json。我备份了package-lock.json并将其重命名为package.json,并再次执行npm install @types/react,它开始解决依赖关系。
我有一些其他的错误消息,比如“需要React@^16的对等体,但没有安装”......我发现了另一个S/O问题,解决了剩下的问题:react-router-dom@4.0.0 requires a peer of react@^15 but none is installed. You must install peer dependencies yourself
后来,一位同事指出,实际上有一个package.json文件,但它在另一个文件夹中。我需要cd到该文件夹并运行npm install。这是修复一切的最后一步。

5t7ly7z5

5t7ly7z53#

我遇到了同样的问题,这是因为我在vscode中安装了Deno扩展。Deno不理解节点模块。禁用扩展解决了我的问题

mqxuamgl

mqxuamgl4#

Cannot find module 'xxx'.ts(2307)错误表示您的package.json文件中列出的xxx软件包不在您的node_modules目录中,或者由于其他原因无法访问。
要解决此错误,请在命令行界面(CLI)中将目录更改为应用程序的根目录,然后运行npm install xxx

  • ...其中xxx是缺失软件包的名称;在本例中为React。*

如果失败,您可能需要导航到VS Code的“工具”部分的“命令行”下的“PowerShell”来执行相同的操作。

xmq68pz9

xmq68pz95#

我知道这是针对VS Code的,但是你移除Deno扩展的解决方案在IntelliJ上对我很有效

kyks70gy

kyks70gy6#

我在这里遇到了同样的问题,但这是因为我手动重命名了整个react项目所在的文件夹。
我唯一要做的就是重新运行pnpm install/npm install

nqwrtyyt

nqwrtyyt7#

这也发生在我身上。突然间,它影响了我所有的打字项目,甚至是那些之前工作正常的项目。
我尝试了许多不同的解决方案,花了很多时间来解决这个问题。对我来说,工作只是为了删除全局安装的节点模块。
rm -rf /usr/local/lib/node_modules

e7arh2l6

e7arh2l68#

是什么为我做的-只需关闭编辑器,然后再次打开:)

yjghlzjz

yjghlzjz9#

我不确定,但我认为只能在.tsx文件中使用react。而且第一行必须是

import * as React from "react";
import { Component } from 'react';

相关问题