This is a tailor who helps us customise our projects. In this very initial version(1.x), there is only one function that this tailor adjusts the Angular's HttpClient, then we can easily change the baseUrl of requesting an API in ./environments/environmen.ts

ng-tailor

Git Hub: https://github.com/tliu14/ng-tailor

Dangling a carrot

This guy now can only provide one function, but I will try my best to make it versatile in the future. For example, it could generate an out-of-the-box axios in angular, it could genereate an out-of-the-box auth-module, and the list goes on.

Install

npm i -g ng-tailor

or

yarn global add ng-tailor

Use

Ensure you already have an angular-cli.

ng new <your-project>

cd your-project

nt-cus-apiurl

Then ng-tailor will create two files and modify two files:

├── app
│   ├── app-routing.module.ts
│   ├── app.component.css
│   ├── app.component.html
│   ├── app.component.spec.ts
│   ├── app.component.ts
│   ├── app.module.ts --*[modified]
│   ├── http
│   │   └── api-url-interceptor.ts  --*[created]
│   └── http-interceptors
│       └── index.ts  --*[created]
├── assets
├── environments
│   ├── environment.prod.ts
│   └── environment.ts  --*[modified]
├── favicon.ico
├── index.html
├── main.ts
├── polyfills.ts
├── styles.css
└── test.ts

There you can change the baseUrl (Axios likes to call it this name, and sometimes it is called VUE_APP_API_URL in Vue's dotenv file.) in environment.ts.

export const environment = {
  production: false,
  // Here is your API_URL.
  NG_API_URL: 'http://localhost:4200/api',
}