react项目typescript版本过低导致build报错的问题

原创

已于 2022-11-18 15:49:30 修改 · 1.6k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#react.js #typescript #javascript

于 2022-11-18 15:47:53 首次发布

在更新一个长时间未维护的react项目时，由于typescript版本过低，导致自动化构建失败并出现编译错误TS1110。通过查阅资料发现，这个问题是由于新添加的库需要更高版本的typescript支持模板文字类型。解决方案是升级项目中的typescript和react-scripts到最新或相匹配的版本，并处理可能因升级产生的语法报错。

今天需要对一个将近一年没有动过的react老项目上添加一点需求。需求很简单，本以为可以光速完成，然后开启今天的摸鱼之旅。

代码写的很流畅，三下五除二就到了 git push 这一步，然后到gitlab上把代码一合并（项目使用的是Gitlab-CICD自动化构建），本以为到这里就打完收工了。

过了一会儿一看，居然build失败了，wath？打开控制台一看，报了如下错误：

在这里插入图片描述
/data/builds/HGeMevr6/0/xxx/node_modules/@types_react-router@5.1.19@@types/react-router/index.d.ts
TypeScript error in /data/builds/HGeMevr6/0/xxx/node_modules/@types_react-router@5.1.19@@types/react-router/index.d.ts(149,100): Type expected. TS1110


match<Params> | null;
export type ExtractRouteOptionalParam<T extends string, U = string | number | boolean> = T extends `${infer Param}?`
                                                                                       
     ? { [k in Param]?: U }
     : T extends `${infer Param}*`
     ? { [k in Param]?: U }

这是啥玩意啊