Skip to content

Scoped library paths cannot be resolved #10620

Closed

Description

@msterba

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)

Activity

  1. johnbwoodruff commented on May 4, 2018

    @johnbwoodruff

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

  2. rafaelbatistamarcilio commented on May 4, 2018

    @rafaelbatistamarcilio

    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

  3. ocombe commented on May 4, 2018

    @ocombe
    Contributor

    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>)
  4. ocombe commented on May 4, 2018

    @ocombe
    Contributor

    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
  5. filipesilva commented on May 4, 2018

    @filipesilva
    Contributor

    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.

  6. gms1 commented on May 5, 2018

    @gms1

    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

  7. gms1 commented on May 5, 2018

    @gms1

    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"
          ]
        }
    
  8. kolkov commented on May 13, 2018

    @kolkov

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

  9. filipesilva commented on May 13, 2018

    @filipesilva
    Contributor

    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 https://github.com/dherges/ng-packagr/pull/862 (not overriding baseUrl in ng-package) should fix it.

  10. maxime1992 commented on Oct 22, 2018

    @maxime1992
    Contributor

    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:

    image

  11. rupertgcox commented on Oct 24, 2018

    @rupertgcox

    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
    
  12. freepee commented on Mar 19, 2019

    @freepee

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

  13. stephaneeybert commented on Jul 30, 2019

    @stephaneeybert

    Is that issue similar ?

  14. maxime1992 commented on Jul 30, 2019

    @maxime1992
    Contributor

    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 👍

  15. angular-automatic-lock-bot commented on Sep 9, 2019

    @angular-automatic-lock-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.

  16. locked and limited conversation to collaborators on Sep 9, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions