Use paths mapping with tsconfig.e2e.json result to Cannot find module error

Versions

Angular CLI: 1.6.8
Node: 8.9.1
OS: win32 x64
Angular: 5.2.4
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cli: 1.6.8
@angular-devkit/build-optimizer: 0.0.42
@angular-devkit/core: 0.0.29
@angular-devkit/schematics: 0.0.52
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.8
@schematics/angular: 0.1.17
typescript: 2.5.3
webpack: 3.10.0
Done in 1.78s.

Windows 10

Repro steps

• Step 1 Declare new paths in tsconfig.e2e.json

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/e2e",
    "baseUrl": "./",
    "module": "commonjs",
    "target": "es5",
    "types": [
      "jasmine",
      "jasminewd2",
      "node"
    ],
    "paths": {
      "@mypath/*": [
        "./mypath/*"
      ]
    }
  }
}

• Step 2 npm run ng e2e

Observed behavior

[12:13:32] E/launcher - Error: Error: Cannot find module '@myPath/path'
    at Function.Module._resolveFilename (module.js:536:15)
    at Function.Module._load (module.js:466:25)
    at Module.require (module.js:579:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (C:\Projects\frontend\e2e\app.po.ts:2:1)
    at Module._compile (module.js:635:30)
    at Module.m._compile (C:\Projects\frontend\node_modules\ts-node\src\index.ts:422:23)
    at Module._extensions..js (module.js:646:10)
    at Object.require.extensions.(anonymous function) [as .ts] (C:\Projects\frontend\node_modules\ts-node\src\index.ts:425:12)
    at Module.load (C:\Projects\frontend\node_modules\coffee-script\lib\coffee-script\register.js:45:36)
    at tryModuleLoad (module.js:497:12)
    at Function.Module._load (module.js:489:3)
    at Module.require (module.js:579:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (C:\Projects\frontend\e2e\app.e2e-spec.ts:1:1)
    at Module._compile (module.js:635:30)
    at Module.m._compile (C:\Projects\frontend\node_modules\ts-node\src\index.ts:422:23)
    at Module._extensions..js (module.js:646:10)
    at Object.require.extensions.(anonymous function) [as .ts] (C:\Projects\frontend\node_modules\ts-node\src\index.ts:425:12)
    at Module.load (C:\Projects\frontend\node_modules\coffee-script\lib\coffee-script\register.js:45:36)
    at tryModuleLoad (module.js:497:12)
    at Function.Module._load (module.js:489:3)
    at Module.require (module.js:579:17)
    at require (internal/module.js:11:18)
    at C:\Projects\frontend\node_modules\jasmine\lib\jasmine.js:93:5
    at Array.forEach (<anonymous>)
    at Jasmine.loadSpecs (C:\Projects\frontend\node_modules\jasmine\lib\jasmine.js:92:18)
    at Jasmine.execute (C:\Projects\frontend\node_modules\jasmine\lib\jasmine.js:197:8)
    at C:\Projects\frontend\node_modules\protractor\built\frameworks\jasmine.js:132:15
    at Function.promise (C:\Projects\frontend\node_modules\protractor\node_modules\q\q.js:682:9)
    at C:\Projects\frontend\node_modules\protractor\built\frameworks\jasmine.js:104:14
    at _fulfilled (C:\Projects\frontend\node_modules\protractor\node_modules\q\q.js:834:54)
    at self.promiseDispatch.done (C:\Projects\frontend\node_modules\protractor\node_modules\q\q.js:863:30)
    at Promise.promise.promiseDispatch (C:\Projects\frontend\node_modules\protractor\node_modules\q\q.js:796:13)
    at C:\Projects\frontend\node_modules\protractor\node_modules\q\q.js:556:49
    at runSingle (C:\Projects\frontend\node_modules\protractor\node_modules\q\q.js:137:13)
    at flush (C:\Projects\frontend\node_modules\protractor\node_modules\q\q.js:125:13)
    at _combinedTickCallback (internal/process/next_tick.js:131:7)
    at process._tickCallback (internal/process/next_tick.js:180:9)
[12:13:32] E/launcher - Process exited with error code 100
error Command failed with exit code 4.

Desired behavior

Paths should be resolved like expected in tsconfig

Mention any other details that might be useful (optional)

[splincode]

Solution

npm install tsconfig-paths --save-dev

e2e/tsconfig.e2e.json

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/e2e",
    "baseUrl": "./",
    "module": "commonjs",
    "target": "es5",
    "types": [
      "jasmine",
      "jasminewd2",
      "node"
    ],
    "paths": {
      "@e2e/*": [
        "../e2e/*"
      ]
    }
  }
}

protractor.conf.js

const tsConfig = require("./e2e/tsconfig.e2e.json");
...
onPrepare() {
   
    require('ts-node').register({
      project: 'e2e/tsconfig.e2e.json'
    });
    require("tsconfig-paths").register({
      project: 'e2e/tsconfig.e2e.json',
      baseUrl: 'e2e/',
      paths: tsConfig.compilerOptions.paths
    });
   
  }
...

[ypolosov]

i’ve found the temporary solution:

My versions:

Angular CLI: 1.7.1
Node: 8.7.0
OS: linux x64
Angular: 5.2.7
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

@angular/cli: 1.7.1
@angular/flex-layout: 5.0.0-beta.13
@angular-devkit/build-optimizer: 0.3.2
@angular-devkit/core: 0.3.2
@angular-devkit/schematics: 0.3.2
@ngtools/json-schema: 1.2.0
@ngtools/webpack: 1.10.1
@schematics/angular: 0.3.2
@schematics/package-update: 0.3.2
typescript: 2.6.2
webpack: 3.11.0

The solution is the usage of ‘tsconfig-paths’ package.

1. npm install tsconfig-paths --save-dev
2. Put following code lines at the beginning of protractor.conf.js

require('ts-node/register');
require('tsconfig-paths/register');

1. Set pathes area in tsconfig.json

"baseUrl": ".",
"paths": {
    "@my-scope/shared/*": ["../shared/*"]
}

1. As the result you can use following import in *.e2e-spec.ts and *.po.ts files

import { Logger } from '@my-scope/shared/logger';