ng-jhipster

!Logojhipster-imagejhipster-url
Greetings, Java Hipster!
This is the JHipster Angular 2+ utilities library
!NPM versionnpm-imagenpm-url !Azure DevOps Build Statusazure-devops-imageazure-devops-url-main !Build Statustravis-imagetravis-url !Dependency Statusdaviddm-imagedaviddm-url
This library is used by the code generated by the generator-jhipster: https://github.com/jhipster/generator-jhipster/. When releasing a new version of the generator-jhipster then this is tested with the specific version of the ng-jhipster referenced in the generated package.json file. If your application is generated by the older version of the generator-jhipster and you manually update ng-jhipster version in the package.json then this may and may not work. To use a newer version of the ng-jhipster, regenerate application with a newer version of the generator-jhipster which generates a right ng-jhipster version into package.json file.
Full documentation and information is available on our website at https://jhipster.tech/jhipster-url
Please read our guidelines before submitting an issue. If your issue is a bug, please use the bug template pre populated here. For feature requests and queries you can use this templatefeature-template.

Development setup

You need NodeJS and NPM.

Fork the ng-jhipster project

Go to the ng-jhipster project and click on the "fork" button. You can then clone your own fork of the project, and start working on it.
Please read the Github forking documentation for more information

Build

Run npm install to install all dependencies.
Make some changes, run npm run test to run both eslint/tslint and unit tests.
Build the library with npm run build.
Package the library by running npm pack in the dist directory. This will create an archive ng-jhipster-vX.Y.Z.tgz.
For testing, you will want to integrate this archive into an application generated by JHipster.
Go to your generated JHipster application and run...

npm install path/to/ng-jhipster/dist/ng-jhipster-vX.Y.Z.tgz

...so that your JHipster application uses the content of this archive as ng-jhipster dependency which is located in node_modules/ng-jhipster.

Quick development

You can quickly test library changes in Angular application generated by JHipster in the following manner.

1. Generate Angular application using JHipster generator.

1. Actions in the ng-jhipster project.

- In the `ng-package.dev.json` change the value of the `dest` to some subfolder inside generated project, for example if using **Gradle** or **skipping server** then you can use `GeneratedAppRootFolder/build/dist/ng-jhipster` and if using **Maven** then use `target` subfolder instead of `build`.  
   For example, if the generated app and the `ng-jhipster` are siblings in the disk then you can use:

    ```
    "dest": "../generated-app-root-folder-name/build/dist/ng-jhipster",
    ```

    One note about this change. As Angular framework architecture excpects that in building app all blocks of the application are inside app root folder then you can't skip this step. If you don't do this change and in the generated app `tsconfig.json` file refer to `ng-jhipster` default destination folder like this `"ng-jhipster": ["../ng-jhipster/dist"]` then runtime errors will occur on running app.

- Run `npm run build:dev`

1. Actions in the generated application.

- In the `tsconfig.json` file, add the following entry into `compilerOptions.paths`:

    ```
    "ng-jhipster": ["build/dist/ng-jhipster"]
    ```

- Optional step. If you are using some other subfolder than `build` or `target` for `ng-jhipster` build destination and this folder is not in `.eslintignore` then add this folder there (this suppresses ESLint errors for compiled `ng-jhipster` bundle)

- Run `npm start`

Now on every change in ng-jhipster the following will happen automatically:

• ng-jhipster rebuilds
• generated app rebuilds using freshly built local ng-jhipster
• generated app is reloaded in the browser and you can see and test changes made in the ng-jhipster