Node.js SPFx Web部件-节点模块/@types/[prop types]和[react]index.d.ts:；错误TS1005“；论吞咽式身材

因此，我正在构建一个spfx Web部件，其中一个功能是显示链接预览。 我用它来完成这项任务。我必须更改包“styled components”的版本，并更新我的“react”（16.4.18）和“react dom”（16.0.9）以使其工作。进行这些更改并运行

gulpbuild

后，我收到以下错误列表：

[10:21:13] [tsc] typescript version: 2.4.2
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(27,38): error TS1005: '=' expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(29,46): error TS1005: ';' expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(29,75): error TS1005: ';' expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(29,99): error TS1005: ';' expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(31,54): error TS1005: ';' expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(31,78): error TS1005: ';' expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(31,81): error TS1109: Expression expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(31,97): error TS1109: Expression expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(31,122): error TS1005: ';' expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(31,130): error TS1128: Declaration or statement expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(31,138): error TS1005: ',' expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(44,48): error TS1005: ';' expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(44,49): error TS1109: Expression expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(44,50): error TS1109: Expression expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(44,68): error TS1005: '(' expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(44,69): error TS1005: ')' expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(46,30): error TS1005: ';' expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(46,54): error TS1005: ';' expected.
[10:21:17] Error - [tsc] node_modules/@types/prop-types/index.d.ts(46,57): error TS1109: Expression expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2297,27): error TS1005: ';' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2298,14): error TS1005: ':' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2298,28): error TS1005: ';' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2299,9): error TS1109: Expression expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2300,9): error TS1005: '(' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2301,9): error TS1005: '(' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2302,5): error TS1005: '(' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2302,12): error TS1005: ')' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2314,49): error TS1005: ';' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2314,76): error TS1005: ';' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2314,99): error TS1005: ';' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2315,13): error TS1128: Declaration or statement expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2316,13): error TS1005: '(' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2316,17): error TS1005: ',' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2316,44): error TS1005: ',' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2316,45): error TS1005: ':' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2318,17): error TS1005: '(' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2318,21): error TS1005: ',' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2318,51): error TS1005: ',' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2318,52): error TS1005: ':' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2320,21): error TS1005: '(' expected.
[10:21:17] Error - [tsc] node_modules/@types/react/index.d.ts(2320,24): error TS1005: ')' expected.
[10:21:17] Error - 'tsc' sub task errored after 3.75 s
 exited with code 2

与我的类似，建议我将typescript版本更新为2.3.4或更高版本

还有另外一个github问题，我现在找不到，建议将typescript版本更新到2.8.x或更高版本

我的打字脚本版本是3.1.3。我在本地（在项目的节点模块文件夹中）和全局安装了相同的版本。正如您可能已经注意到的，在构建开始时，我将获得输出

[tsc] typescript version: 2.4.2

我已经将“package.json”文件以及warn.lock文件（我使用的是warn）中与typescript相关的所有条目更改为“3.1.3”或“~3.1.3”，正如它们最初所说的“2.4.1”或“2.4.2”或“~2.4.1”或“~2.4.2”。从我所读到的内容来看，它与定义/增量语法有关，仅在typescript 2.8及以上版本中受支持。对于istance，其中一行是：

 Error - [tsc] node_modules/@types/prop-types/index.d.ts(27,38): error TS1005: '=' expected.

export const nominalTypeHack: unique symbol;

一般来说，我对typescript和node还很陌生，所以这可能是导致我不知道如何解决这个问题的另一个原因

如果有更多的信息要提供，我将很乐意这样做。提前感谢您提供的所有建议和答案。

我做了一个快速操作，发现了几个线程（例如），表明SPFx构建系统将人们固定在旧版本的TypeScript上。我没有看到解决办法

一种可行的方法是将代码分为与React交互的部分和与SPFx交互的部分，使用最新版本的

tsc

将第一部分编译为JavaScript，并在通过SPFx构建系统编译第二部分时包含生成的JavaScript文件。我对SPFx构建系统一无所知，不知道这是否可行；如果你尝试一下，遇到了一个特殊的问题，我也许能帮上忙

---

另一个想法是使用与您的TypeScript版本兼容的

@types

包的旧版本，尽管它们可能缺少您需要的功能。例如，对于TypeScript 2.4.2，您可以通过运行

npm install@types/prop>来安装
@types/prop types的
ts2.4
标记-types@ts2.4
（或
npm安装-D@types/prop-types@ts2.4
；有关差异的详细信息，请参见）。
在对react和react dom版本进行了一些修改之后，将我的本地typescript版本重置为所需的2.4.2，并修改一些其他依赖项，我让“gulp build”再次工作。我现在面临的问题是，在本地工作台中加载我的Web部件时，出现了找不到“”的错误。实际上，packages文件夹中不包含这样的目录。但它也不包含在工作的Web部件中。我不明白重点。具体来说，node/webpack似乎有问题？我知道这条评论很旧，但可能会帮助其他人：确保您首先导航到
/workbench
端点，它会复制所需的文件并将您重定向到您所在的页面。我认为您错过了将react.js复制到右侧的步骤。