options

General

port      : 55555,           // port to serve during watch
unminified: false,           // switch to unminified
names     : 'app*, release', // list of compositions to include in the build
publicPath: undefined,       // CDN path for release builds
globals   : {},              // A hash of packages keyed by their global variable
stats     : {                // console output
  hash        : true,
  version     : true,
  timings     : true,
  assets      : true,
  chunks      : true,
  modules     : true,
  reasons     : true,
  children    : true,
  source      : true,
  errors      : true,
  errorDetails: true,
  warnings    : true,
  publicPath  : true
}

port

The port from which a browser-sync server will run.

Should be customised to a differnt value for every project.

unminified

Compilation of compositions is minified by default. However the quality of the source-maps should ensure you rarely notice.

Set this option to true to inhibit minification.

names

The format of the names option may be an Array of strings, or a single comma separated string.

Names are the mode followed by a dot-delimted representation of the subdirectory of /app that the composition resides in. For example:

• In app mode the root composition is named "app".
• In release mode the root composition is named "release".
• In app mode the composition /app/foo is named "app.foo".
• In release mode the composition /app/foo is named "release.foo".

An asterix * may be used to match any trailing character. Meaning, for example, that:

• "*" will include all compositions in both app and release modes,
• "app*" will include all compositions in app mode and nothing in release mode,

publicPath

Where release mode is used, this option will sets the Webpack output.publicPath.

This will result in all assets being referenced with an absolute path.

globals

Note that there are no globals in applications bundled by Webpack. You will need to provide a map of package keyed by global.

For example, for jQuery use all of the following:

globals: {
  $              : 'jquery',
  jQuery         : 'jquery',
  'window.jQuery': 'jquery'
}

Better practice may be to solve the problem at its source using module Shimming.

stats

Customise the console output from the compiler.

Refer to the webpack stats options reference.

Convention breaking

These additional settings may be used to deviate from Angularity's optinionated project structure.

appDir    : './app',           // your composition roots
buildDir  : './app-build',     // output of the app build
testDir   : './app-test',      // output of the test build
releaseDir: './app-release',   // output of the release build
testGlob  : '**/*.spec.js'     // identify your test files

Environment variables

All options may be parsed from uppercase keys and string values. This allows you to pass in environment variables without any additional parsing.

• Use an underscrore to delimit camel-case, meaning buildDir is written as environment variable BUILD_DIR.

• Use a double underscore to delimit a nested field, meaning stats.warnings is written as environment variable STATS__WARNINGS.

For example, to suppress warnings during the build:

{
  "scripts": {
    "silent": "cross-env STATS__WARNINGS=false webpack --progress"
  }
}

The cross-env utility is bundled with the package so is available within npm scripts.

It allows environment variables to be set for a given execution, without writing them permanently at the operating system level.

It supports single or double quotes to surround variables with special characters.