after doing "npx sb init" (react storybook): node_modules/react-router/index.d.ts:151:74 - error TS1110: Type expected error

user_17702686 0
Viewed 3505

I am working on a large typescript react monorepo. In one of the packages I added react storybook using "npx sb init"

After doing that, when I did a yarn build of the entire repo, I get these errors:

node_modules/react-router/index.d.ts:151:74 - error TS1110: Type expected.

151 declare type ParamParseSegment<Segment extends string> = Segment extends `${infer LeftSegment}/${infer RightSegment}` ? ParamParseSegment<LeftSegment> extends infer LeftResult ? ParamParseSegment<RightSegment> extends infer RightResult ? LeftResult extends string ? RightResult extends string ? LeftResult | RightResult : LeftResult : RightResult extends string ? RightResult : ParamParseFailed : ParamParseFailed : ParamParseSegment<RightSegment> extends infer RightResult ? RightResult extends string ? RightResult : ParamParseFailed : ParamParseFailed : Segment extends `:${infer Remaining}` ? Remaining : ParamParseFailed;
                                                                             ~~~

node_modules/react-router/index.d.ts:151:83 - error TS1005: '}' expected.

151 declare type ParamParseSegment<Segment extends string> = Segment extends `${infer LeftSegment}/${infer RightSegment}` ? ParamParseSegment<LeftSegment> extends infer LeftResult ? ParamParseSegment<RightSegment> extends infer RightResult ? LeftResult extends string ? RightResult extends string ? LeftResult | RightResult : LeftResult : RightResult extends string ? RightResult : ParamParseFailed : ParamParseFailed : ParamParseSegment<RightSegment> extends infer RightResult ? RightResult extends string ? RightResult : ParamParseFailed : ParamParseFailed : Segment extends `:${infer Remaining}` ? Remaining : ParamParseFailed;
                                                                                      ~~~~~~~~~~~

node_modules/react-router/index.d.ts:151:94 - error TS1128: Declaration or statement expected.

151 declare type ParamParseSegment<Segment extends string> = Segment extends `${infer LeftSegment}/${infer RightSegment}` ? ParamParseSegment<LeftSegment> extends infer LeftResult ? ParamParseSegment<RightSegment> extends infer RightResult ? LeftResult extends string ? RightResult extends string ? LeftResult | RightResult : LeftResult : RightResult extends string ? RightResult : ParamParseFailed : ParamParseFailed : ParamParseSegment<RightSegment> extends infer RightResult ? RightResult extends string ? RightResult : ParamParseFailed : ParamParseFailed : Segment extends `:${infer Remaining}` ? Remaining : ParamParseFailed;
                                                                                                 ~

node_modules/react-router/index.d.ts:151:96 - error TS1161: Unterminated regular expression literal.

151 declare type ParamParseSegment<Segment extends string> = Segment extends `${infer LeftSegment}/${infer RightSegment}` ? ParamParseSegment<LeftSegment> extends infer LeftResult ? ParamParseSegment<RightSegment> extends infer RightResult ? LeftResult extends string ? RightResult extends string ? LeftResult | RightResult : LeftResult : RightResult extends string ? RightResult : ParamParseFailed : ParamParseFailed : ParamParseSegment<RightSegment> extends infer RightResult ? RightResult extends string ? RightResult : ParamParseFailed : ParamParseFailed : Segment extends `:${infer Remaining}` ? Remaining : ParamParseFailed;
                                                                                                   


Found 4 errors.

error Command failed with exit code 1.

I googled but only found one result that was the same issue and it was unresolved. Does anyone know what might be the issue?

storybook typescript reactjs
4 Answers

I also faced the same issue after integrating the story book.I was unable to run the application using yarn start.

I tried upgrading the typescript by using yarn upgrade typescript@latest (If you are using npm then use npm update typescript@latest)

After upgrading the typescript issue got resolved for me.

Thank you

user_81955400
user_56337850

This is known errors likes

Cannot find name 'infer'.
...
ERROR TS2304: Cannot find name 'LeftSegment'."

This is happens when I had a "typescript": "~4.0.2" So you need to update typescript to the latest stable version with command npm i typescript@latest, in my case updated to "typescript": "^4.5.4".

With these changes, the storybook should be working fine.

user_75021940

I have fixed the error by doing the following

npm i react-router-dom@5.3.0
npm i @types/react-router-dom@5.3.0
user_71035340
Related