Javascript – How to properly resolve imports with custom paths in Angular?

I’m using Angular 18 and trying to import a component(app1/reusable.component.ts) from one project into another one(app2).

And then, I want the component to import its dependencies from the project folder where it itself has been imported into (app2/node_modules) instead of the folder where it is located.

My folder structure looks something like the following:

root
├──app1
│  ├──...
│  ├──node_modules
│  ├──src
│  │  ├──...
│  │  ├──app
│  │  │  ├──...
│  │  │  ├──reusable.component.ts
│  
├──app2
│  ├──...
│  ├──node_modules
│  ├──src
│  │  ├──...
│  │  ├──app
│  │  │  ├──...
│  │  │  ├──app.component.ts

Where the relevant component files are:

// app1/src/app/reusable.component.ts

import { Component } from '@angular/core'; // this is an example of dependency that needs to be imported of app2/node_modu;es

@Component({
  selector: 'reusable-component',
  standalone: true,
  template: 'Reusable Component',
})
export class ReusableAppComponent {
  title = 'ReusableAppComponent';
}

and

// app2/src/app/app.component.ts

import { Component } from '@angular/core';
import { ReusableAppComponent } from '../../../app1/src/app/reusable.app.component'

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [ReusableAppComponent],
  template: '<reusable-component></reusable-component>',
})
export class AppComponent {
  title = 'app2';
}

What I have tried so far. And steps to reproduce.

Setup: initialized app1 and app2 with ng new and removed app1/node_modules.

Then, assuming I could pull this off with paths option in tsconfig,
I’ve Modified the compilerOptions in app2/tsconfig.json by adding

    "baseUrl": "./",
    "paths": {
      "@angular/core": ["node_modules/@angular/core"],
      "tslib": ["node_modules/tslib"]
    }

As a result at runtime I see both ReusableComponent and Component from @angular/core get imported, however an error in the console appears:

ERROR RuntimeError: NG0203: inject() must be called from an injection context such as a constructor, a factory function, a field initializer, or a function used with `runInInjectionContext`. Find more at https://angular.dev/errors/NG0203
    at injectInjectorOnly (main.js:650:11)
    at ɵɵinject (main.js:660:59)
    at Object.factory (main.js:14888:45)
    at chunk-IMMNNYUP.js?v=a145dfc3:1965:35
    at runInInjectorProfilerContext (chunk-IMMNNYUP.js?v=a145dfc3:567:5)
    at R3Injector.hydrate (chunk-IMMNNYUP.js?v=a145dfc3:1964:11)
    at R3Injector.get (chunk-IMMNNYUP.js?v=a145dfc3:1854:23)
    at definition.getStandaloneInjector (main.js:14895:27)
    at ComponentFactory.create (chunk-IMMNNYUP.js?v=a145dfc3:9692:53)
    at _ApplicationRef.bootstrap (chunk-IMMNNYUP.js?v=a145dfc3:18388:38)