Project Dependencies

This page seeks to document all the dependencies / tools used by our project along with the reason(s) why they are being used.

Dependency Lists

All app dependencies are pulled in via NPM package manager, see our package.json.

Per the Angular 2 dependency recommendations, our NPM dependencies are split into dependencies (core dependencies) and devDependencies (development dependencies) within the package.json configuration.

1. The dependencies section should include feature packages (e.g. Angular 2 itself) and polyfills

• Polyfills are Javascript packages that plug gaps in the browser's Javascript implementation. Angular requires certain polyfills (to support cross-browser compatibility and latest Javascript features). The polyfills that Angular 2 currently requires are listed at https://angular.io/docs/ts/latest/guide/npm-packages.html#!#polyfill-packages

2. The devDependencies section should include packages that help us develop/transpile the application. They do not need to be deployed with the production application.

Core dependencies (dependencies)

• angular2 - UI framework (obviously)
• angular2-express-engine - Required by Angular Universal
• angular2-hapi-engine - Required by Angular Universal
• angular2-universal-preview (Angular Universal) - Provides server-side Javascript rendering (i.e. "universal" or isomorphic javascript) for Angular 2
• angular2-universal-polyfills - Polyfills for Angular Universal. Required by Angular Universal
• angular2-websocket - UNCLEAR IF THIS IS IN USE?
• express
• jquery
• preboot - Tool that allows you to record and playback any browser events that occur while the client-side application is loading. Angular Universal uses this to control a server-rendered page and transfer state to the client-side app.. Required by Angular Universal
• rxjs - A polyfill for the "Observables specification" currently under approval by the committee who determines standards for the JavaScript language. Required by Angular Universal
• zone.js - A polyfill for the "Zone specification" currently under approval by the committee who determines standards for the JavaScript language. Required by Angular Universal

Development dependencies (devDependencies)

• bootstrap-loader - Bootstrap loader for WebPack. Used in our webpack.config.js to load Bootstrap styles/scripts
• bootstrap-sass - Required by bootstrap-loader.
• commander - module which allows you to build commandline interfaces to node.js programs. Used by our src/proxy.js to build a commandline enabled proxy.
• concurrently - used to run multiple npm commands concurrently on Linux, Windows and Mac. Used in our scripts in package.json
• css-loader - CSS loader for WebPack. Used in our webpack.config.js to process .scss files. Used by bootstrap-loader.
• http-proxy - HTTP proxying library. Used by our src/proxy.js to provide a commandline proxy to REST calls (in order to provide CORS headers)
• node-sass - Required/Used by bootstrap-loader.
• nodemon - used to automatically restart the server when source code changes. See also our nodemon.json for configuration.
• resolve-url-loader
• rimraf - provides the Unix command rm -rf for Node / NPM. Used by our package.json to cleanup old dist directories.
• sass-loader - SASS loader for WebPack. Used in our webpack.config.js to process .scss files. Used by bootstrap-loader.
• style-loader - Style loader for WebPack. Used in our webpack.config.js to process .scss files. Used by bootstrap-loader.
• ts-loader - TypeScript loader for WebPack. Used in our webpack.config.js to process TypeScript files
• typedoc - Generates documentations from TypeScript comments (like JavaDocs but for TypeScript).
• typescript - The TypeScript language server and compiler. We use the TypeScript language to build all UI components. See also our TypeScript Guidelines and our tsconfig.json configuration file.
• typings - Manager for all third-party TypeScript definitions. See also our typings.json for configuration.
• url-loader - URL loader for WebPack. Provides a data URL for files. Used in our webpack.config.js.
• webpack - WebPack is a module builder. It essentially builds/transpiles our application (see webpack.config.js)
• webpack-merge - WebPack merge function. Used in our webpack.config.js to merge several module configs into one.
• ws - UNCLEAR IF THIS IS IN USE?