Explanation for angular 2 package.json file

Question

I'm not willing to use typescript compiler provided in angular 2 quick start guide and will use gulp.js instead. However there are few questions I have about package.json file provided on angular website:

{
  "name": "angular-starter",
  "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"
  }
}

I'm sure that few things like tsc, tsc:w script comands alongside typescript devDependency can be safely removed, but am not sure about purpose for things like concurently dependency as well as dependency section in general, could you guys provide more info on all dependencies that follow angular2? I tried looking these up in quickstart guide along apendixes, but had no luck as they are very short.

Did you look them up at npmjs.org? – xkcd149 Jan 11 '16 at 14:57 — xkcd149, Jan 11 '16 at 14:57

Nexus23 · Accepted Answer · 2016-01-11T16:11:54.727

concurently is and npm package which allows to run multiple CLI commands in one shot, see line below in package.json. concurrent command is coming from concurrenlty. You can remove that safely.

"start": "concurrent \"npm run tsc:w\" \"npm run lite\" "

dependency section in package.json file lets you keep track of project dependencies. Using reference of these packages in dependency section allows you to use module bundler like webpack, browserify etc. It also keeps your project linked to specific versions of each of these packages if new version introduce any breaking changes etc. Having this section in package.json file lets you remove packages directory (node_modules) to be under source control. Installing these packages again on lets say another machine requires only package.json and dependency section in it.

For each package in dependency section search npmjs website for more details.

score 1 · Answer 2 · edited May 23 '17 at 10:27

Well adding some points with @nexus23's answer. my answer is not completed i know but for comment it is too long so posting as answer hope this will help somene.

Package.json is the important file for the project where you import our dependencies list which you used in your project. Basically there are three types of dependencies

Dependency
DevDependency
peerDependency for more documentation refer here in the answers.

now come to the point i.e answer to this question. there are few dependencies which we have to include for make our angular2 project run.which is listed below.

angular2 -- is the basic file for the angular2 project. which is most important file for our project. (stable latest version is angular2 beta)
systemjs -- is the Universal dynamic module loader - loads ES6 modules, AMD, CommonJS and global scripts in the browser and NodeJS. Works with both Traceur and Babel. we use systemjs Config for setup the baseUrl, to Import main file etc in our main file i.e index.html like following:

<script> System.config({ baseURL: '<%= APP_BASE %>', paths: {'*': '*.js?v=<%= VERSION %>'}, defaultJSExtensions: true }); </script>

Explanation for angular 2 package.json file

2 Answers2