I was following Angular2 quickstart and installed required libraries using Node package manager:

created a package.json:

{
  "name": "angular2-quickstart",
  "version": "1.0.0",
  "scripts": {
    "tsc": "tsc",
    "tsc:w": "tsc -w",
    "lite": "lite-server",
    "start": "concurrent \"npm run tsc:w\" \"npm run lite\" "
  },
  "license": "ISC",
  "dependencies": {
    "angular2": "2.0.0-beta.0",
    "systemjs": "0.19.6",
    "es6-promise": "^3.0.2",
    "es6-shim": "^0.33.3",
    "reflect-metadata": "0.1.2",
    "rxjs": "5.0.0-beta.0",
    "zone.js": "0.5.10"
  },
  "devDependencies": {
    "concurrently": "^1.0.0",
    "lite-server": "^1.3.1",
    "typescript": "^1.7.3"
  }

Executed

npm install

But npm install command downloads a lot of files for instance "node_modules\angular2" is 32MB (probably raw sources and other stuff included?), allthough index.html requires only few of them and for instance angular2.dev.js is only 1MB:

<!-- 1. Load libraries -->
<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<script src="node_modules/rxjs/bundles/Rx.js"></script>
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>

I would like that quickstart project doesn't take this much disk space. Is there a way to tell npm to download only "bundles" or minimized versions, or is there a way to optimize node_modules directory when packaging for production?

I was following Angular2 quickstart and installed required libraries using Node package manager: https://angular.io/guide/quickstart

created a package.json:

{
  "name": "angular2-quickstart",
  "version": "1.0.0",
  "scripts": {
    "tsc": "tsc",
    "tsc:w": "tsc -w",
    "lite": "lite-server",
    "start": "concurrent \"npm run tsc:w\" \"npm run lite\" "
  },
  "license": "ISC",
  "dependencies": {
    "angular2": "2.0.0-beta.0",
    "systemjs": "0.19.6",
    "es6-promise": "^3.0.2",
    "es6-shim": "^0.33.3",
    "reflect-metadata": "0.1.2",
    "rxjs": "5.0.0-beta.0",
    "zone.js": "0.5.10"
  },
  "devDependencies": {
    "concurrently": "^1.0.0",
    "lite-server": "^1.3.1",
    "typescript": "^1.7.3"
  }

Executed

npm install

But npm install command downloads a lot of files for instance "node_modules\angular2" is 32MB (probably raw sources and other stuff included?), allthough index.html requires only few of them and for instance angular2.dev.js is only 1MB:

<!-- 1. Load libraries -->
<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<script src="node_modules/rxjs/bundles/Rx.js"></script>
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>

I would like that quickstart project doesn't take this much disk space. Is there a way to tell npm to download only "bundles" or minimized versions, or is there a way to optimize node_modules directory when packaging for production?

• javascript
• npm
• angular

• it's worth noting that the quickstart installs many dependencies for a functional node server which may not be necessary if you intend to use some other server technology. For example, you wouldn't install typescript or lite-server in your production environment. For starting a project quickly and seeing immediate results, it is perfect. A quickstart can't adequately cover every possible combination of server stack, so it must include something basic. You don't have to use what it includes, of course. – Claies Commented Jan 8, 2016 at 7:47

3 Answers 3

You can use the cdn versions of those files and use node_modules in development and don't include them in production at all:

<script src="https://rawgithub.com/systemjs/systemjs/0.19.6/dist/system.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.0/angular2-polyfills.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.0/Rx.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.0/angular2.dev.js"></script>

Take a look at this question and the comments in the answers: Angular 2 required libraries

Also this is the smallest package.json you can get away with (depending in your setup):

{ "dependencies": { "angular2": "2.0.0-beta.0", "systemjs": "0.19.6" } }

I'm using Webstorm which starts its own server and compiles typescript on its own when it detects the tsconfig.json file.

So if you don't have your own server you'll need to add the lite-server dependency, config and scripts, and if you don't have a ts compiler you'll have to add the typescript dependency and scripts as well:

"devDependencies": { "typescript": "^1.7.3" },

You could use ng new barebones-app --minimal

You can remove unnecessary dependencies from package.json. Also, dependencies declared in devDependencies section is not bundled when packaging for production.