Scoped library paths cannot be resolved #10620

msterba · 2018-05-04T00:06:16Z

See also #10172
The generated path aliases seem not right.

Versions

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/
    

Angular CLI: 6.0.0
Node: 10.0.0
OS: linux x64
Angular: 6.0.0
... animations, cli, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.6.0
@angular-devkit/build-angular      0.6.0
@angular-devkit/build-ng-packagr   0.6.0
@angular-devkit/build-optimizer    0.6.0
@angular-devkit/core               0.6.0
@angular-devkit/schematics         0.6.0
@ngtools/json-schema               1.1.0
@ngtools/webpack                   6.0.0
@schematics/angular                0.6.0
@schematics/update                 0.6.0
ng-packagr                         3.0.0-rc.2
rxjs                               6.1.0
typescript                         2.7.2
webpack                            4.6.0

Repro steps

ng new my-project
cd my-project
ng generate library foo
ng generate library @msterba/bar
ng build foo
ng build @msterba/bar

Now try to import BarModule into the app.

Observed behavior

The libraries are compiled correctly but the resulting directory structure in dist is not reflected by the paths definitions in tsconfig.json:

directory structure:

dist
+- foo
+- @msterba
   +- bar


tsconfig.json:

"paths": {
  "foo": [
    "dist/foo"
  ],
  "bar": [
    "dist/bar"
  ]
}

BarModule cannot be imported.

// src/app/app.module.ts:
import { FooModule } from 'foo'; // ok
import { BarModule } from '@msterba/bar'; // [ts] Cannot find module '@msterba/bar'.

// console:
$ ng build

ERROR in src/app/app.module.ts(8,27): error TS2307: Cannot find module '@msterba/bar'.

Desired behavior

Add scopes to the paths definitions.

"paths": {
  "foo": [
    "dist/foo"
  ],
  "@msterba/bar": [
    "dist/@msterba/bar"
  ]
}

Mention any other details that might be useful (optional)

The text was updated successfully, but these errors were encountered:

johnbwoodruff · 2018-05-04T02:25:42Z

Same issue happening with me. Perhaps there's something in the configuration files that is needed to be changed manually for this to work?

rafaelbatistamarcilio · 2018-05-04T03:16:50Z

Same to load feature module with lazy loading

{
        path: 'user',
        loadChildren: 'app/user/user.module#UserModule'
}

ERROR in Could not resolve module app/user/user.module relative to /C/dsv/client/pwa-ng/src/app/app.routing.ts

ocombe · 2018-05-04T08:39:32Z

Ah I was about to open an issue about this!
I've updated the paths in tsconfig.json, but it still doesn't build my second library that depends on the first one, even if ng test actually works fine for both

Repro:

git clone https://github.com/ngx-translate/core/tree/monorepo
npm i
ng build @ngx-translate/core
ng build @ngx-translate/http-loader

Error log:

ng build @ngx-translate/http-loader
Building Angular Package
Building entry point '@ngx-translate/http-loader'
Rendering Stylesheets
Rendering Templates
Compiling TypeScript sources through ngc

BUILD ERROR
projects/ngx-translate/http-loader/src/lib/http-loader.ts(2,31): error TS2307: Cannot find module '@ngx-translate/core'.

Error: projects/ngx-translate/http-loader/src/lib/http-loader.ts(2,31): error TS2307: Cannot find module '@ngx-translate/core'.

    at Object.<anonymous> (C:\www\ngx-translate-monorepo\node_modules\ng-packagr\lib\ngc\compile-source-files.js:61:68)
    at Generator.next (<anonymous>)
    at C:\www\ngx-translate-monorepo\node_modules\ng-packagr\lib\ngc\compile-source-files.js:7:71
    at new Promise (<anonymous>)
    at __awaiter (C:\www\ngx-translate-monorepo\node_modules\ng-packagr\lib\ngc\compile-source-files.js:3:12)
    at Object.compileSourceFiles (C:\www\ngx-translate-monorepo\node_modules\ng-packagr\lib\ngc\compile-source-files.js:19:12)
    at Object.<anonymous> (C:\www\ngx-translate-monorepo\node_modules\ng-packagr\lib\ng-v5\entry-point\ts\compile-ngc.transform.js:42:34)
    at Generator.next (<anonymous>)
    at C:\www\ngx-translate-monorepo\node_modules\ng-packagr\lib\ng-v5\entry-point\ts\compile-ngc.transform.js:7:71
    at new Promise (<anonymous>)

projects/ngx-translate/http-loader/src/lib/http-loader.ts(2,31): error TS2307: Cannot find module '@ngx-translate/core'.

Error: projects/ngx-translate/http-loader/src/lib/http-loader.ts(2,31): error TS2307: Cannot find module '@ngx-translate/core'.

    at Object.<anonymous> (C:\www\ngx-translate-monorepo\node_modules\ng-packagr\lib\ngc\compile-source-files.js:61:68)
    at Generator.next (<anonymous>)
    at C:\www\ngx-translate-monorepo\node_modules\ng-packagr\lib\ngc\compile-source-files.js:7:71
    at new Promise (<anonymous>)
    at __awaiter (C:\www\ngx-translate-monorepo\node_modules\ng-packagr\lib\ngc\compile-source-files.js:3:12)
    at Object.compileSourceFiles (C:\www\ngx-translate-monorepo\node_modules\ng-packagr\lib\ngc\compile-source-files.js:19:12)
    at Object.<anonymous> (C:\www\ngx-translate-monorepo\node_modules\ng-packagr\lib\ng-v5\entry-point\ts\compile-ngc.transform.js:42:34)
    at Generator.next (<anonymous>)
    at C:\www\ngx-translate-monorepo\node_modules\ng-packagr\lib\ng-v5\entry-point\ts\compile-ngc.transform.js:7:71
    at new Promise (<anonymous>)

ocombe · 2018-05-04T08:43:33Z

Temporary fix: use npm link
In my case:

ng build @ngx-translate/core
npm link ./dist/@ngx-translate/core
ng build @ngx-translate/http-loader

filipesilva · 2018-05-04T16:22:20Z

I'm not sure what's going wrong here but you really shouldn't use npm link. There are many, many situations where things will break because of it.

gms1 · 2018-05-05T13:25:36Z

I have implemented a similar workaround for my project:
https://github.com/gms1/angular-dynaform
using dependency:

"@angular-dynaform/core": "file:../../../dist/@angular-dynaform/core"

and a postinstall script:
https://github.com/gms1/angular-dynaform/blob/master/build/js/postinstall.js
Of course, this dependency must be removed before publishing the generated packages

All lib-projects had different 'dest' properties defined for production and non-production build ( see ng-package.json ), so this cannot work with static path definitions
but ng-packagr seems to ignore these path definitions anyway

gms1 · 2018-05-05T13:57:56Z

a similar issue:
#10444
the suggestion, adding a path definition to tsconfig.lib.json, from @aboodz works for me:

    "paths": {
      "@angular-dynaform/core": [
        "../../../../dist/@angular-dynaform/core"
      ]
    }

kolkov · 2018-05-13T08:41:10Z

One sleepless night passed ...))) Thanks!

filipesilva · 2018-05-13T08:57:40Z

Heya, I think the problems described in this issue are partially the same as #10615.

angular/devkit#895 (using the right paths for scoped libs) together with ng-packagr/ng-packagr#862 (not overriding baseUrl in ng-package) should fix it.

maxime1992 · 2018-10-22T11:18:44Z

Not sure that issue's resolved 🤷‍♂️

I've been upgrading to the following:

Angular CLI: 7.0.2
Node: 8.9.4
OS: linux x64
Angular: 7.0.0
... animations, cdk, common, compiler, compiler-cli, core, forms
... http, language-service, material, platform-browser
... platform-browser-dynamic, platform-server, router

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.10.2
@angular-devkit/build-angular      0.10.2
@angular-devkit/build-ng-packagr   0.10.2
@angular-devkit/build-optimizer    0.10.2
@angular-devkit/build-webpack      0.10.2
@angular-devkit/core               7.0.2
@angular-devkit/schematics         7.0.2
@angular/cli                       7.0.2
@angular/flex-layout               7.0.0-beta.19
@ngtools/json-schema               1.1.0
@ngtools/webpack                   7.0.2
@schematics/angular                7.0.2
@schematics/update                 0.10.2
ng-packagr                         4.4.0
rxjs                               6.3.3
typescript                         3.1.3
webpack                            4.19.1

and I get the error:

ERROR in src/app/app-routing.module.ts(10,41): error TS2307: Cannot find module 'visualiser-sandbox'.

/tsconfig.json:

{
  ...
  paths: {
    "visualiser-sandbox": [
      "dist/visualiser-sandbox"
    ],
    "visualiser-sandbox/*": [
      "dist/visualiser-sandbox/*"
    ],
  }
}

I can see that the dist folder contains visualiser-sandbox and everything into it:

rupertgcox · 2018-10-24T09:50:01Z

I'm on version 6.2.2 (which I believe is well after the fix was merged in) and am seeing exactly the same issue as @maxime1992

Angular CLI: 6.2.2
Node: 10.7.0
OS: darwin x64
Angular: 6.1.7
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.8.2
@angular-devkit/build-angular      0.8.2
@angular-devkit/build-ng-packagr   0.8.6
@angular-devkit/build-optimizer    0.8.2
@angular-devkit/build-webpack      0.8.2
@angular-devkit/core               0.8.2
@angular-devkit/schematics         0.8.2
@angular/cdk                       6.4.7
@angular/cli                       6.2.2
@angular/material                  6.4.7
@ngtools/json-schema               1.1.0
@ngtools/webpack                   6.2.2
@schematics/angular                0.8.2
@schematics/update                 0.8.2
ng-packagr                         4.4.0
rxjs                               6.3.2
typescript                         2.9.2
webpack                            4.19.0

freepee · 2019-03-19T13:59:50Z

I'm having the same issue as @maxime1992 and @rupertgcox and wonder if this has been solved or if there exists an solution?

stephaneeybert · 2019-07-30T13:59:08Z

Is that issue similar ?

maxime1992 · 2019-07-30T14:17:10Z

So I'm not sure whether it's the same thing or not but I moved away from using libraries within the dist folder and instead pick up from the source directly.

{
  ...
  paths: {
    "visualiser-sandbox": [
      "dist/visualiser-sandbox"
    ],
    "visualiser-sandbox/*": [
      "dist/visualiser-sandbox/*"
    ],
  }
}

became

{
  ...
  paths: {
      "visualiser-sandbox": ["projects/visualiser-sandbox/src/public_api"],
      "visualiser-sandbox/*": ["projects/visualiser-sandbox/src/public_api"]
  }
}

When navigation with the IDE inside the code it's also giving me better access to the source instead of pointing to the dist folder 👍

angular-automatic-lock-bot · 2019-09-09T19:41:21Z

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.}

hansl added type: bug/fix comp: cli/build freq2: medium severity2: inconvenient workaround2: non-obvious labels May 4, 2018

filipesilva mentioned this issue May 13, 2018

fix(@schematics/angular): fix scoped library paths angular/devkit#895

Merged

Brocco closed this as completed in angular/devkit#895 May 15, 2018

angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 9, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Scoped library paths cannot be resolved #10620

Scoped library paths cannot be resolved #10620

msterba commented May 4, 2018

johnbwoodruff commented May 4, 2018

rafaelbatistamarcilio commented May 4, 2018

ocombe commented May 4, 2018 •

edited

Loading

ocombe commented May 4, 2018 •

edited

Loading

filipesilva commented May 4, 2018

gms1 commented May 5, 2018 •

edited

Loading

gms1 commented May 5, 2018

kolkov commented May 13, 2018

filipesilva commented May 13, 2018

maxime1992 commented Oct 22, 2018

rupertgcox commented Oct 24, 2018

freepee commented Mar 19, 2019

stephaneeybert commented Jul 30, 2019

maxime1992 commented Jul 30, 2019

angular-automatic-lock-bot bot commented Sep 9, 2019

Scoped library paths cannot be resolved #10620

Scoped library paths cannot be resolved #10620

Comments

msterba commented May 4, 2018

Versions

Repro steps

Observed behavior

Desired behavior

Mention any other details that might be useful (optional)

johnbwoodruff commented May 4, 2018

rafaelbatistamarcilio commented May 4, 2018

ocombe commented May 4, 2018 • edited Loading

ocombe commented May 4, 2018 • edited Loading

filipesilva commented May 4, 2018

gms1 commented May 5, 2018 • edited Loading

gms1 commented May 5, 2018

kolkov commented May 13, 2018

filipesilva commented May 13, 2018

maxime1992 commented Oct 22, 2018

rupertgcox commented Oct 24, 2018

freepee commented Mar 19, 2019

stephaneeybert commented Jul 30, 2019

maxime1992 commented Jul 30, 2019

angular-automatic-lock-bot bot commented Sep 9, 2019

ocombe commented May 4, 2018 •

edited

Loading

ocombe commented May 4, 2018 •

edited

Loading

gms1 commented May 5, 2018 •

edited

Loading