React TypeScript应用程序获取’TS2304：找不到名称’文本’.’

发布时间：2020-12-15 20:16:49 所属栏目：百科来源：网络整理

导读：这是我的package.json中的依赖项.这曾经在我过去工作过. { "name": "login-ts-react","version": "1.0.0","main": "webpack.config.js","scripts": { "start": "webpack-dev-server" },"repository": "https://github.com/abhsrivastava/login-ts-react.git"

这是我的package.json中的依赖项.这曾经在我过去工作过.

{
  "name": "login-ts-react","version": "1.0.0","main": "webpack.config.js","scripts": {
    "start": "webpack-dev-server"
  },"repository": "https://github.com/abhsrivastava/login-ts-react.git","author": "Abhishek Srivastava <abhsrivastava@foo>","license": "MIT","dependencies": {
    "react": "^16.3.2","react-bootstrap": "^0.32.1","react-dom": "^16.3.2"
  },"devDependencies": {
    "@types/react": "^16.3.13","@types/react-bootstrap": "^0.32.9","@types/react-dom": "^16.0.5","awesome-typescript-loader": "^5.0.0","css-loader": "^0.28.11","html-webpack-plugin": "^3.2.0","import-glob-loader": "^1.1.0","mini-css-extract-plugin": "^0.4.0","node-sass": "^4.9.0","sass-loader": "^7.0.1","source-map-loader": "^0.2.3","style-loader": "^0.21.0","typescript": "^2.8.3","webpack": "^4.6.0","webpack-cli": "^2.0.15","webpack-dev-server": "^3.1.3"
  }
}

我的tsconfig.js看起来像

"target": "es5","lib": ["es6"],"module": "commonjs","jsx": "react","sourceMap": true,"outDir": "./build","removeComments": true,"strict": true,"noImplicitAny": true,"strictPropertyInitialization": true,"noImplicitThis": true,"alwaysStrict": true,"noUnusedLocals": true,"noUnusedParameters": true,"noImplicitReturns": true,"noFallthroughCasesInSwitch": true,"baseUrl": "./src","esModuleInterop": true

当我开始纱线时,我得到错误

ERROR in [at-loader] ./node_modules/@types/react-dom/index.d.ts:19:72
    TS2304: Cannot find name 'Text'.

ERROR in [at-loader] ./src/index.tsx:6:28
    TS2304: Cannot find name 'document'.

我上周用这个相同的package.json创建了一个应用程序,它没有这些错误.

编辑::基于下面的答案,我尝试了两件事

tsconfig.js

"target": "es6",

现在,当我开始纱线时,我得到了错误

ERROR in [at-loader] ./node_modules/@types/react-dom/index.d.ts:19:72
    TS2304: Cannot find name 'Text'.

ERROR in [at-loader] ./src/index.tsx:5:28
    TS2304: Cannot find name 'document'.

我也试过了

"target": "es5","lib": ["es6","dom"],

现在我收到错误

ERROR in [at-loader] ./node_modules/@types/node/index.d.ts:2381:15
    TS2300: Duplicate identifier 'URL'.

ERROR in [at-loader] ./node_modules/@types/node/index.d.ts:2399:15
    TS2300: Duplicate identifier 'URLSearchParams'.

ERROR in [at-loader] ./node_modules/@types/node/index.d.ts:2417:14
    TS2661: Cannot export 'URL'. Only local declarations can be exported from a module.

ERROR in [at-loader] ./node_modules/@types/node/index.d.ts:2417:19
    TS2661: Cannot export 'URLSearchParams'. Only local declarations can be exported from a module.
Child html-webpack-plugin for "index.html":

解决方法

这可能是由tsconfig.json中的以下设置引起的：

...
"target": "es5",<- right here
...

在这里,你明确地告诉tsc你想拥有es5 javascript(目标配置).同时,您说要包含es6内置类型声明(以及仅内置类型声明的es6).

现在,这本身不是一个问题,tsc将允许你这样做(虽然我会辩论这一点：你的代码将在非es6浏览器上破解,除非你在构建管道中提供polyfill).但是,如果您要告诉tsc您明确需要的库,则必须确保不要忘记应用程序中需要的任何类型.简而言之,如果您想使用Typescript创建Web应用程序,您通常还希望拥有dom声明,以便能够访问DOM接口类型,例如文档或文本.打字稿开发人员决定模块化内置库定义starting in typescript 2(想想DOM类型声明没有意义的上下文,比如开发一个node.js app！).

以下是我建议您更改tsconfig.json的方法：

"target": "es6",...

摆脱lib会给你默认：“lib”：[“es6”,“dom”](取决于你设置的目标).由于您似乎想在项目中使用es6,因此将其设置为您的转换目标.

如果你想把es5作为你的目标,并且想要明确关于lib,这应该让你的应用程序编译(虽然我不能推荐这个,原因如上所述)

"target": "es5","dom"]
"module": "commonjs",...

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!