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

[hellraisercenobit]

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)

[ivanguimam]

I have the same problem, any solution?

[hellraisercenobit]

I tried a lot of things since my last report to fix it but the same behavior occured.

[ivanguimam]

And how are you doing to run your tests? @hellraisercenobit

[hellraisercenobit]

@ivanguimam My first problem was for environments folder to use the same as my app.
To fix it i'll just have to copy paste my env folder to e2e dir and use relative paths instead.
Ugly XD but it work.
Maybe you should try with latest angular/cli version and angular 5.2.9.
Or Wait for v6.
I'll try it too soon.

[hellraisercenobit]

Same with latest angular/cli

[ivanguimam]

No fix yet for this error?

[ypolosov]

i have the same problem ...wait for the solution

[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');

3. Set pathes area in tsconfig.json

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

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

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

[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
    });
   
  }
...