Export all libs as NPM package

[jahow]

Similar to #592.

This PR introduces a package directory with:

• a generate-package.js node script
• an index.ts file which serves as an entrypoint for the package compilation
• a ng-package.json file which is used by ng-packagr
• a package.json describing the npm package
• a tsconfig.json file used for the package compilation

The generate-package.js file does:

• copy the contents of the libs folder in the package directory, keeping only relevant files (ts, css, html...)
• transform the import aliases in the TS files back to a relative path using the paths property of tsconfig.base.json; for instance:

  import { UiLayoutModule } from "@geonetwork-ui/ui/layout"

  becomes:

  import { UiLayoutModule } from "../../../libs/ui/layout"

  (this is needed because ng-packagr does not support Typescript path aliases)
• launch a compilation of the copied sources using ng-packagr; this is necessary because Angular libraries have to be published according to the Angular Package Format
• the compilation output is going to package/dist; then the script also copies the source libs folder there as well so that consumers of the package can be redirected to the source file when inspecting it

An example usage of the generated package can be seen here: https://github.com/jahow/geonetwork-ui-custom-app
E.g.

import {UiElementsModule, UiInputsModule, UiWidgetsModule} from 'geonetwork-ui'

Notes:

• To make the compilation work I had to ensure that all components were exported through their respective lib index.ts file
• Some cyclic dependencies had also to be resolved

To do:

• more tests on the consumer app side
• maybe add separate entrypoints, e.g. geonetwork-ui/ui-layout?
• handle material theme and icon font
• document

[github-actions]

Affected libs: api-repository, feature-catalog, feature-record, feature-router, feature-search, feature-map, feature-dataviz, feature-auth, common-domain, api-metadata-converter, feature-editor, ui-search, common-fixtures, util-shared, ui-elements, ui-catalog, ui-widgets, ui-inputs, ui-map, ui-dataviz, ui-layout, data-access-datafeeder, util-data-fetcher, util-app-config, data-access-gn4, util-i18n,
Affected apps: datahub, map-viewer, metadata-editor, search, demo, webcomponents, datafeeder, metadata-converter, data-platform,

• 🚀 Build and deploy storybook and demo on GitHub Pages
• 📦 Build and push affected docker images

[jahow]

No idea what this line was doing here to be honest!!

[coveralls]

coverage: 83.888% (-2.8%) from 86.643%
when pulling 3cdac10 on export-as-npm-package
into 295eda8 on main.

[tkohr]

Thanks for this nice PR @jahow with a great description and extensive documentation!

Maybe the PR description could also go into a package/readme.md?

FYI, when testing, I needed to force npm install because of peer dependency conflicts with gn-ui still in angular 16 and your demo app in angular 17. Nevertheless, I ended up with your demo app running and calling GN behind it, nice :-)

Generating a new app following the doc I still run into some error when trying to start it: ⠸ Building...✘ [ERROR] Could not resolve "react-native-fs" node_modules/alasql/dist/alasql.fs.js:26676:25:. My app is a standalone app without any AppModule for now. Not sure if this is related.

I've used yalc to test this PR:
yalc publish inside gn-ui's package/dist
yalc add [email protected] inside the angular app

[jahow]

I've added a README for the package folder as well as a README for the published package; it's now publicly accessible here: https://www.npmjs.com/package/geonetwork-ui?activeTab=readme

Also added some doc for development workflow in a custom app.

[tkohr]

Thanks for the additional doc and its latest adaptions! Following it, I now get to use the package without forcing npm installs. Really nice 😃