Closed jimsmart closed 7 years ago
wenkangjing
commented
7 years ago Same here on Windows 10 + node v4 + typescript 2.3.4, tried following to walk around, but all failed:
react-router-dom 4.11react-router-dom use react-router instead
eino-makitalo
commented
7 years ago Same me. I tried with
dotnet new reactredux dotnet restore npm install
And no hope same errors and it is when running webpack -> typescript ClientApp/boot-server.tsx(23,18): error TS2604: JSX element type 'StaticRouter' does not have any construct or call signatures. ClientApp/routes.tsx(9,6): error TS2604: JSX element type 'Route' does not have any construct or call signatures. ClientApp/routes.tsx(10,6): error TS2604: JSX element type 'Route' does not have any construct or call signatures. ClientApp/routes.tsx(11,6): error TS2604: JSX element type 'Route' does not have any construct or call signatures. node_modules/@types/react-router/index.d.ts(40,35): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s). node_modules/@types/react-router/index.d.ts(46,29): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s). node_modules/@types/react-router/index.d.ts(56,31): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s). node_modules/@types/react-router/index.d.ts(74,28): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s). node_modules/@types/react-router/index.d.ts(79,29): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s). node_modules/@types/react-router/index.d.ts(87,35): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s). node_modules/@types/react-router/index.d.ts(92,29): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s).
Easy to reproduce just follow basic path.
eino-makitalo
commented
7 years ago I found a workaround. I went offline and I compare packages of working version (before it's updated from network) with npm ls and found differences
Non working version has @types/react-router version 4.0.12 and working one has 4.0.11
1) So delete directory node_modules/@types/react-router.
2) Add explicitely version to package.json 4.0.11 @types/react-router": "4.0.11",
Started to work for me.
{
"name": "x",
"version": "0.0.0",
"dependencies": {
@types/react-router": "4.0.11",
"@types/history": "4.5.1",
"@types/react": "15.0.24",
"@types/react-dom": "15.5.0",
"@types/react-redux": "4.4.40",
"@types/react-router-dom": "4.0.4",
Attached diff to working and nonworking versions... okvsfailed.txt
OlekRia
commented
7 years ago After router upgrade :) Beware to update webpack to 3.0.0 also!
eino-makitalo
commented
7 years ago Well in package.json there is version 2.5.1. I try to install global webpack to 3.00 and local one too It did not help for me. So better to force react-router to older version until this template is fixed?
OlekRia
commented
7 years ago @eino-makitalo No way to install webpack 3 ! I spent too many hours for nothing after it :)
eino-makitalo
commented
7 years ago I had globally webpack 3.00 but in node_modules there is just version 2.5.1. When I just change this @types/react-routerto older one (4.0.11) my compilation start to work. My suggestion is not to update webpack at all. @EmmaHansson I fix my comment because it has ate word @types/react-router,
eino-makitalo
commented
7 years ago @wenkangjing I managed to fix it with that but have to delete types/react-router version manually from node_modules to be able to go back earlier version as explained earlier When explicitely installing older version it satisfied react-router-dom (4.0.4) which normally would load newer version of react-router. This is nodejs hell! (compared to old days dll hell nothing has changed)
david-lennox
commented
7 years ago I had same problem and fixed it by adding the missing argument to classes in node_modules/@types/react-router and node_modules/@types/react-router-dom and node_modules/@types/react-router-redux.
E.g. change export class Route extends React.Component<RouteProps> { } to export class Route extends React.Component<RouteProps, {}> { }
SteveSandersonMS
commented
7 years ago Thanks for reporting this. It's a really nasty mess! The basic issue is:
@types packages do not accurately describe their own compatibility with other dependencies via semver. When one @types depends on another, it just specifies version * which gives a totally untrue view of compatibility.In this particular case, the newly-released @types/react-router 4.0.12 is not compatible with @types/react v15.0.29 (despite claiming to be compatible with version *, i.e., all versions).
To fix this, there are two solutions we'll add:
aspnet-webpack-react, which contains a rather awkward workaround. It includes a bit of TypeScript type definition that patches the compatibility between the two NPM modules mentioned above. For this to work, it also has to edit your tsconfig.json file on installation to add an extra reference to itself. This short-term workaround is necessary because we're about to ship a VS update that includes the ReactReduxSpa template, and it's too late to make further edits to the template contents.
node_modules directory completely, then run npm install. New projects should get it automatically. You might have to clear your NPM cache first if that still isn't getting the new aspnet-webpack-react version 2.0.1.package.json). Then we're no longer at risk of third-party edits breaking things.Besides all this, there's a strong case that the @types project should respect semver in its packages. The @types packages shouldn't claim to be compatible with version * of other @types packages when they are not. I'll file an issue with them about that, though I expect it's something that's been reported in the past already!
wenkangjing
commented
7 years ago Thanks @eino-makitalo, tried your solution but still no luck, end up with other errors after explicitly changing to @types/react-router to 4.0.11, and downgrade @types/react-router-dom to 4.0.4. Sign...spent 4 hours on this...
ERROR in [at-loader] ./ClientApp/components/FetchData.tsx:63:13
TS2605: JSX element type 'Link' is not a constructor function for JSX elements.
ERROR in [at-loader] ./ClientApp/components/NavMenu.tsx:15:21
TS2605: JSX element type 'Link' is not a constructor function for JSX elements.
Types of property 'setState' are incompatible.
Type '{ <K extends never>(f: (prevState: void, props: LinkProps) => Pick<void, K>, callback?: () => any...' is not assignable to type '{ <K extends never>(f: (prevState: {}, props: any) => Pick<{}, K>, callback?: () => any): void; <...'.
Types of parameters 'f' and 'f' are incompatible.
Type '(prevState: {}, props: any) => Pick<{}, any>' is not assignable to type '(prevState: void, props: LinkProps) => Pick<void, any>'.
Types of parameters 'prevState' and 'prevState' are incompatible.
Type 'void' is not assignable to type '{}'.
Hi,
New project freshly generated with 'React with Redux' fails to build.
Project created with only 'React' works ok.
— Looks like it's because of Typescript definitions? Is there a workaround?
Thanks!
Details: OSX 10.11.6 Node v6.11.0 Installed dotnet-dev-osx-x64.1.0.4.pkg
Reproduce: