1

I have a library with a workspace containing two projects, one for the library itself and one for a test application.

├── projects
    ├── midi-app
    └── midi-lib

In the workspace tsconfig.json file I configured the baseUrl property:

"baseUrl": "./projects/midi-lib/src"

For the record, in this same file there are also some paths mappings:

"paths": {
  "midi-lib": [
    "dist/midi-lib"
  ],
  "midi-lib/*": [
    "dist/midi-lib/*"
  ],
  "@angular/*": [
    "./node_modules/@angular/*"
  ]
}

There is also a projects/midi-lib/tsconfig.lib.json file which extends on the above tsconfig.json file:

"extends": "../../tsconfig.json",

but it contains no such baseUrl nor paths properties.

The build command of the library sub project is successful:

$ ng build midi-lib --watch
Building Angular Package
Building entry point 'midi-lib'
Compiling TypeScript sources through ngc
Bundling to FESM2015
Bundling to FESM5
Bundling to UMD
No name was provided for external module 'lib/service' in output.globals – guessing 'service'
No name was provided for external module 'lib/store' in output.globals – guessing 'store'
Minifying UMD bundle
WARN: Dropping duplicated definition of variable B [0:71,24]
WARN: Dropping duplicated definition of variable J [0:177,24]
Copying declaration files
Writing package metadata
Removing scripts section in package.json as it's considered a potential security vulnerability.
Built midi-lib
Built Angular Package!
 - from: /home/stephane/dev/js/projects/angular/midi-lib/projects/midi-lib
 - to:   /home/stephane/dev/js/projects/angular/midi-lib/dist/midi-lib

I have a projects/midi-lib/src/lib/service/index.ts file which contains:

export { MidiService } from 'lib/service/midi.service';
export { KeyboardService } from 'lib/service/keyboard.service';
export { SynthService } from 'lib/service/synth.service';
export { CommonService } from 'lib/service/common.service';
export { GeneratorService } from 'lib/service/generator.service';
export { MelodyService } from 'lib/service/melody.service';
export { ParseService } from 'lib/service/parse.service';
export { SheetService } from 'lib/service/sheet.service';

and allows such import statement:

import { SynthService } from 'lib/service';

I also have a projects/midi-lib/src/lib/index.ts file which contains:

export { Device } from 'lib/model';
export { MidiService } from 'lib/service';
export { DeviceStore, SoundtrackStore } from 'lib/store';

but is not being used yet, or so it seems to me.

I'm trying to use this library with the test application but its build command ng serve fails with the error:

$ ng serve
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **

Date: 2019-08-17T08:02:39.883Z
Hash: c6ef855b8b8907504425
Time: 69624ms
chunk {es2015-polyfills} es2015-polyfills.js, es2015-polyfills.js.map (es2015-polyfills) 323 kB [initial] [rendered]
chunk {main} main.js, main.js.map (main) 37.9 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 254 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.08 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 17 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 4.45 MB [initial] [rendered]

ERROR in ../midi-lib/src/lib/model/index.ts
Module build failed (from /home/stephane/dev/js/projects/angular/midi-lib/node_modules/@ngtools/webpack/src/index.js):
Error: /home/stephane/dev/js/projects/angular/midi-lib/projects/midi-lib/src/lib/model/index.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.

Before trying to simply use the baseUrl property for absolute import statements, I tried using the paths property, but I failed miserably.

As a side note, my VSCode doesn't show any error.

I'm under version:

Angular CLI: 7.3.9
Node: 10.15.1
OS: linux x64
Angular: 8.1.3
Stephane
  • 11,836
  • 25
  • 112
  • 175

1 Answers1

0

Base url is configuration for whole application not for some external libraries you can use base url like this ./ or src so in your case if you need additional scripts or js files go to angular.json find architect -> build -> scripts and add those file path to scripts array so when angular start or build will now from where to load and access those files.

Stefan Morcodeanu
  • 2,108
  • 1
  • 11
  • 17