Angular-cli: CLI V6 share code (module, component, etc...) between multiple projects

[ofirrifo]

Bug Report or Feature Request (mark with an x)

- [x] bug report -> please search issues before submitting
- [x] feature request

Area

- [x] CLI V6

Versions

node v9.7.1
npm v6.1.0
macOS High Sierra

Angular CLI: 6.0.7
Node: 9.7.1
OS: darwin x64
Angular:
...

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.6.7
@angular-devkit/core         0.6.7
@angular-devkit/schematics   0.6.7
@schematics/angular          0.6.7
@schematics/update           0.6.7
rxjs                         6.2.0
typescript                   2.7.2

Repro steps

after I upgrade my cli project to CLI v6 in order to use multiple projects I created another project
and I try to share code from my first project: root/src/app/ and use it in the new project: root/projects/my-second-app

Projects structure

├── projects
│   ├── my-second-app
│   └── my-second-app-e2e
├── src
│   ├── app

I just import module and use one of the components in the second app.

serve my second project work for me but when I execute ng build my-second-app --prod --aot
I get this error:

ERROR in : Cannot determine the module for class XXXComponent in /Users/.../xxx.component.ts! Add xxxComponent to the NgModule to fix it.

this is strange since this module is of the first project and it not part of the module I'm using in the second project.

in case I'm execute ng build my-second-app without the flags: --prod --aot it work

I'm not sure if sharing module like I did is the best practice and if not what is the best practice to share code like module, services etc when I have multiple projects.

The log given by the failure

ERROR in : Cannot determine the module for class XXXComponent in /Users/.../xxx.component.ts! Add xxxComponent to the NgModule to fix it.

Desired functionality

Option 1: ng build my-second-app --prod --aot should pass like ng build my-second-app
Option 2: in case the way I try to share code is not the correct way please suggest another way?

Mention any other details that might be useful

[filipesilva]

The recommended way of sharing code between projects is to use libraries. There's some information on the wiki as to how you can create a library with CLI 6: https://github.com/angular/angular-cli/wiki/stories-create-library

When you don't create a library, and try to build in AOT, you can get very weird errors related to the file structure. This happens because compiling an app using AOT expects that app to truly be an app, with an app structure. Just having a few files elsewhere breaks this assumption.

It's possible to just have some TS files outside of your project but it's very tricky and hard to configure. To avoid problems generally, a library is the correct approach.

[ofirrifo]

@filipesilva
Thanks for the fast answer, I really appreciate it.
BTW you are doing a really great job with the CLI :)

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