Environment variables are used for configuration. This package provides a script to search for usages in bundled angular files and a script for inserting populated environment variables into index.html file(s) by replacing  (Missing environment variables will be represented by null). This should be done on the host serving the bundled angular files.

AOT

This will not work in Module.forRoot or Module.forChild scripts or parameters. These are build time only due to AOT restrictions.

Getting Started

npm install --save angular-server-side-configuration

environment.prod.ts

Use process.env.NAME in your environment.prod.ts, where NAME is the environment variable that should be used.

import 'angular-server-side-configuration/process';

export const environment = {
  production: process.env.PROD !== 'false',
  apiAddress: process.env.API_ADDRESS || 'https://example-api.com'
};

index.html (Optional)

Add  to index.html. This will be replaced by the configuration script tag. This is optional, as the environment variables can simply be inserted somewhere in the head tag. It is however the safest option.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Angular Example</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
  <!--CONFIG-->
</head>
<body>
  <app-root></app-root>
</body>
</html>

On host server or in Dockerfile (or similar)

npm install -g angular-server-side-configuration
ngssc insert /path/to/angular/files --search

CLI

angular-server-side-configuration provides a CLI.

npm install angular-server-side-configuration -g
ngssc --help

Insert

Usage: insert [options] [directory]

Search and replace the placeholder with environment variables (Directory defaults to current working directory)

Options	Description
`-s, --search`	Search environment variables in available .js files (Defaults to false)
`-e, --env <value>`	Add an environment variable to be resolved (default: [])
`-p, --placeholder <value>`	Set the placeholder to replace with the environment variables (Defaults to `<!--CONFIG-->`)
`-h, --head`	Insert environment variables into the head tag (after title tag, if available, otherwise before closing head tag)
`--dry`	Perform the insert without actually inserting the variables
`-h, --help`	output usage information

Init

Usage: init [options] [directory]

Initialize an angular project with angular-server-side-configuration (Directory defaults to current working directory)

Options	Description
`-ef, --environment-file`	The environment file to initialize (environmentFile defaults to src/environments/environment.prod.ts)
`--npm`	Install angular-service-side-configuration via npm (Default)
`--yarn`	Install angular-service-side-configuration via yarn
`-h, --help`	output usage information

License

Apache License, Version 2.0

Keywords

FAQs

What is angular-server-side-configuration?

Is angular-server-side-configuration popular?

Is angular-server-side-configuration well maintained?

Package last updated on 18 Dec 2018

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

angular-server-side-configuration