When creating from YO template keep getting missing packages

[hotfirewire]

Updated the NPM and YO packages then ran the tool to generate the project. I get the following error:

`  NuGet Config files used:
      C:\Users\user\AppData\Roaming\NuGet\NuGet.Config
      C:\Program Files (x86)\NuGet\Config\Microsoft.VisualStudio.Offline.config

  Feeds used:
      https://api.nuget.org/v3/index.json
      C:\Program Files (x86)\Microsoft SDKs\NuGetPackages\
module.js:472
    throw err;
    ^

Error: Cannot find module 'error-ex'
    at Function.Module._resolveFilename (module.js:470:15)
    at Function.Module._load (module.js:418:25)
    at Module.require (module.js:498:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (C:\Source\Sandbox\PIM\PIM\node_modules\parse-json\index.js:2:15)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)
module.js:472
    throw err;
    ^

Error: Cannot find module 'error-ex'
    at Function.Module._resolveFilename (module.js:470:15)
    at Function.Module._load (module.js:418:25)
    at Module.require (module.js:498:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (C:\Source\Sandbox\PIM\PIM\node_modules\parse-json\index.js:2:15)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)

`

When I open the project in VS 2017 and run the project I get missing packages:

`
Exception: Call to Node module failed with error: Error: Cannot find module 'extract-text-webpack-plugin'
Exception: Call to Node module failed with error: Error: Cannot find module 'awesome-typescript-loader'
`

I then run NPM to install the missing packages then run webpack manually to generate the JS files. This however gives me the following:

[at-loader] Checking finished with 1 errors

[at-loader] Checking finished with 1 errors
Hash: 0ef252295aa5eb552550c5e0b7f41d2555297297
Version: webpack 2.3.3
Child
    Hash: 0ef252295aa5eb552550
    Time: 3301ms
                 Asset      Size  Chunks             Chunk Names
        main-client.js   49.7 kB       0  [emitted]  main-client
              site.css   1.56 kB       0  [emitted]  main-client
    main-client.js.map   31.6 kB       0  [emitted]  main-client
          site.css.map  85 bytes       0  [emitted]  main-client

    ERROR in [at-loader] ./ClientApp/components/Layout.tsx:13:21
        TS2322: Type '{}' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<NavMenu> & { children?: ReactNode; } & void'.
      Type '{}' is not assignable to type 'void'.
Child
    Hash: c5e0b7f41d2555297297
    Time: 3290ms
             Asset     Size  Chunks             Chunk Names
    main-server.js  94.2 kB       0  [emitted]  main-server

    ERROR in [at-loader] ./ClientApp/components/Layout.tsx:13:21
        TS2322: Type '{}' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<NavMenu> & { children?: ReactNode; } & void'.
      Type '{}' is not assignable to type 'void'.

I've reinstalled NPM and all packages, cleared out the cache, etc... not sure what else I can do. Any help would be great.

NPM -v : 4.4.4
Node -v : 7.8.0

Thanks.

[waynebrantley]

While I don't get the missing packages and I can build everything locally...when I use my build server I am getting the TS2322 error above too.

Hope someone knows why!

[MarkPieszak]

What's your node_modules Typescript that got installed, it might be one where type inference got updated heavily, and can bring these types of errors. Is it 2.2+ ?

[waynebrantley]

This is very bizarre. It compiles perfectly on my machine, but on my build server it does not. The issue is actually around the code and it think a LATER version of Typescript is on the build server. You cannot do Component<void,void>, but instead mus do Component<{},{}>.

https://github.com/aspnet/JavaScriptServices/blob/dev/templates/ReactReduxSpa/ClientApp/components/Layout.tsx#L8

should be export class Layout extends React.Component<LayoutProps, {}>

This fixes the compile issue.

@SteveSandersonMS might need to change the template?

[SteveSandersonMS]

I just checked and the error doesn't occur with TypeScript 2.2.2 (which is the latest at the time of writing) in combination with the latest 3rd-party packages.

@waynebrantley Maybe your CI server is using cached packages. Or if you can track this down to a specific package version difference that you think will be affecting others, please let us know!

Closing as it appears to be OK now.

[8enSmith]

@SteveSanderson Following the steps on this page:

http://blog.stevensanderson.com/2016/05/02/angular2-react-knockout-apps-on-aspnet-core/

I chose a React and Redux project.

The site ran fine in production but when I switched to development (following step 5), I too got the error below when running the site in the browser (i.e. http://localhost:5000/):

ERROR in [at-loader] ./ClientApp/components/Layout.tsx:13:21
TS2322: Type '{}' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes & { children?: ReactNode; } & void'.
Type '{}' is not assignable to type 'void'.

I have:

NPM -v : 4.2.0
Node -v : 7.9.0

[SpyRefused]

@8enSmith

The same thing happens to me, the same error.

Also use those versions (the latter) of NPM and Node:

NPM -v : 4.2.0
Node -v : 7.9.0

[SteveSandersonMS]

@8enSmith @SpyRefused Sorry for the inconvenience. This is now fixed in dev. Updated templates will be published shortly.

[SpyRefused]

@SteveSandersonMS thank you very much!

[8enSmith]

@SteveSandersonMS thanks for the quick fix.