Angular-cli: WebPack with @ngtools/webpack throws error "Could not resolve module @angular/core/src/di/opaque_token" when omitting moduleResolution from tsconfig

[yngvebn]

OS?

Windows 10

Versions.

node version: v6.9.5
webpack: 2.2.1
@ngtools/webpack: 1.2.10
@angular/*: 2.4.7

Repro steps.

Created a bare minimum setup with webpack and @ngtools/webpack
Repository for repro here: https://github.com/yngvebn/ngtools-webpack-bug

The log given by the failure.

Hash: e470aac13eddcc425982
Version: webpack 2.2.1
Time: 1575ms
  Asset  Size  Chunks                    Chunk Names
main.js  1 MB       0  [emitted]  [big]  main
   [0] ./~/@angular/core/index.js 2.54 kB {0} [built]
   [3] ./~/@angular/core/src/di.js 764 bytes {0} [built]
   [9] ./~/@angular/platform-browser/src/dom/events/event_manager.js 4.23 kB {0} [built]
  [91] ./~/@angular/core/src/security.js 922 bytes {0} [built]
 [109] ./~/@angular/platform-browser/index.js 635 bytes {0} [built]
 [139] ./~/@angular/core/src/core.js 3.48 kB {0} [built]
 [153] ./~/@angular/core/src/platform_core_providers.js 1.12 kB {0} [built]
 [155] ./~/@angular/core/src/render.js 338 bytes {0} [built]
 [156] ./~/@angular/core/src/util.js 301 bytes {0} [built]
 [157] ./~/@angular/core/src/zone.js 299 bytes {0} [built]
 [161] ./~/@angular/platform-browser/src/browser/tools/tools.js 1.16 kB {0} [built]
 [162] ./~/@angular/platform-browser/src/dom/debug/by.js 1.65 kB {0} [built]
 [166] ./~/@angular/platform-browser/src/platform-browser.js 961 bytes {0} [built]
 [167] ./~/@angular/platform-browser/src/private_export.js 2.32 kB {0} [built]
 [178] ./src/main.ts 291 bytes {0} [built]
    + 164 hidden modules

ERROR in Could not resolve module @angular/core/src/di/opaque_token

ERROR in ./src/main.ts
Module not found: Error: Can't resolve './app/app.module.ngfactory' in 'C:\Github\ngtools-webpack-bug\src'
 @ ./src/main.ts 3:0-64

Mention any other details that might be useful.

The issue goes away either by:
o specifying "moduleResolution": "node" in tsconfig.json
o changing "module" from "es2015" to "commonjs"

By upgrading the @angular/* packages to 4.0.0-beta.7 the error message changes from ERROR in Could not resolve module @angular/core/src/di/opaque_token to ERROR in Could not resolve module @angular/core/src/di/injection_token

[clydin]

The classic module resolution strategy is still present mainly for backwards compatibility reasons and there is really no reason to use it outside of a backwards compatibility scenario. Setting module to commonjs causes the default module resolution strategy to become node which is why it starts working.

[jskrzypek]

After upgrading to @angular/*@4.0.0-rc.1 and npm linking @ngtools/webpack from a clone of the master branch we're getting

ERROR in Could not resolve module @angular/core/src/di/opaque_token

Our tsconfig has "moduleResolution": "node" and "module": "es2015"

[DennisSmolek]

We had the same message popping up so I removed the node_modules folder, npm cache clean and npm install

Now it's working fine.

Oh I also bumped from @ngtools/webpack 1.2.4 to 1.2.12

[filipesilva]

Closing as answered.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}