How to setup the environment for Angular 2.0?

Question

Taking my initial steps towards Angular 2.0.

First thing is to set up the right environment for the development.

My index.html

<!DOCTYPE HTML>
<html>

<head>
  <title>Welcome to Angular 2.0</title>
  <!--css-->
  <link rel="stylesheet" type="text/css" href="css/bootstrap.css" />
 </head>

 <body>
 <div class="container">
    <h1> Hello Angular 2 </h1>
      <my-app> Loading app component....<my-app>
</div>
<!--js-->
<!-- Polyfills for older browsers -->
<script src="https://unpkg.com/core-js/client/shim.min.js"></script>

<script src="https://unpkg.com/zone.js@0.7.4?main=browser"></script>
<script src="https://unpkg.com/reflect-metadata@0.1.8"></script>
<script src="https://unpkg.com/systemjs@0.19.39/dist/system.src.js">   </script>

<script> window.autoBootstrap = true; </script>

<script src="https://cdn.rawgit.com/angular/angular.io/b3c65a9/public/docs/_examples/_boilerplate/systemjs.config.web.js"></script>
<script>
    System.import('app').catch(function (e) { console.log(e); });
  </script>
  <!--js-->
 </body>

 </html>

I have copied the content from https://angular.io/docs/ts/latest/guide/setup.html for the following files:-

app.component.ts
app.module.ts
main.ts

NPM is installed & running.

But in order to get the node_modules folders with the required dependencies for the app to run. What commands do I need to run.

What are the commands that I need to run to set up the Angular 2 environment?

Please note I am new to NPM. Thanks.

@echonax, please note I am new to NPM – Kgn-web Jan 10 '17 at 13:29 — Kgn-web, Jan 10 '17 at 13:29
Just follow the angular docs. That is enough – Mr_Perfect Jan 10 '17 at 13:30 — Mr_Perfect, Jan 10 '17 at 13:30

score 2 · Answer 1 · answered Jan 10 '17 at 13:26

2

You have angular-cli wich is a good starter point. It will set you everything up according to best practices.

answered Jan 10 '17 at 13:26

Philippe Corrèges

663
1
11
31

score 2 · Answer 2 · answered Jan 10 '17 at 13:35

Simple way to set up your first Angular 2 Application.

Download the zip version here.firstAngular2App
Extract it to your destination folder. Assume D:
Open your command prompt(ensure that all required softwares are installed).
Navigate it to the folder. Use the command cd D:\firstAngular2App
Executre npm install
Once it is done use npm start

This way you have your first Angular2 appliction up and running.

SeleM · Accepted Answer · 2017-01-10T13:42:36.063

1

npm install in the root project (it will create your node_modules from the dependencies mentioned in package.json file, should have those files as a start)

edited Jan 10 '17 at 13:42

answered Jan 10 '17 at 13:25

SeleM

9,310
5
32
51

my app is located at D:\Workspace\Angular\Lab1\app – Kgn-web Jan 10 '17 at 13:28
So you should point on it with the `cd ` command, then run `npm install` to get your *node_modules* directory. – SeleM Jan 10 '17 at 13:30
normally you should do in you command prompt: `d:` , then `cd \Workspace\Angular\Lab1\app` , then `npm i` – SeleM Jan 10 '17 at 13:35
Don't you think we need to have package.json?? – Kgn-web Jan 10 '17 at 13:40

score 0 · Answer 4 · answered Sep 19 '17 at 15:34

If you are already using Visual Studio Code as an IDE, you may want to explore how they recommend setting up Angular. I personally found their installation guide painless and feature-rich. I have never walked through an official Angular installation before due to being drenched in jQuery projects. This guide was simple enough to give me a good beginners understanding.

How to setup the environment for Angular 2.0?

4 Answers4

Linked