@angular-builders/dev-server NPM

Dev server builders for Angular build facade

Prerequisites:

Angular CLI 6
@angular-devkit/build-angular >= 0.10.0

Builders

@angular-builders/dev-server:generic

Dev server generic

Enhanced @angular-devkit/build-angular:dev-server builder that leverages the custom webpack builder to get webpack configuration.

Unlike the default @angular-devkit/build-angular:dev-server it doesn't use @angular-devkit/build-angular:browser configuration to run the dev server.
Instead it uses a builder that is specified in browserTarget as long as it provides buildWebpackConfig method.

Thus, if you use @angular-builders/dev-server:generic along with @angular-builders/custom-webpack:browser, ng serve will run with custom configuration provided in the latter.

Usage

npm i -D @angular-builders/dev-server

In your angular.json:

"projects": {
    ...
    "[project]": {
         ...
         "architect": {
                ...
                "[architect-target]": {
                          "builder": "@angular-builders/dev-server:generic"
                          "options": {
                                ...
                          }

Where:

project is the name of the project to which you want to add the builder
architect-target is the name of build target you want to run (build, serve, test etc. or any custom target)

If [architect-target] is not one of the predefined targets (like build, serve etc.) then run it like this:
ng run [project]:[architect-target]
If it is one of the predefined targets, you can run it by ng [architect-target]

Example

angular.json:

"architect": {
    ...
    "build": {
        "builder": "@angular-builders/custom-webpack:browser"
        "options": {
                     "customWebpackConfig": {
                        path: "./extra-webpack.config.js"
                     }
            ...
        },
    "serve": {
        "builder": "@angular-builders/dev-server:generic",
        "options": {
            "browserTarget": "my-project:build"
        }
    }

In this example dev-server will use custom-webpack:browser builder, hence modified webpack config, when invoking the serve target.

@angular-builders/dev-server v7.3.1