Angular 2 环境


要开始使用 Angular 2,你需要安装以下关键组件。

  • Npm : 这被称为节点包管理器,用于与开源存储库一起工作。 Angular JS 作为一个框架依赖于其他组件。和 npm 可用于下载这些依赖项并将它们附加到你的项目中。

  • Git : 这是可以用来获取示例应用程序的源代码软件 github 角位。

  • Editor :有很多编辑器可以用于Angular JS开发,比如Visual Studio code和WebStorm。在我们的教程中,我们将使用 Microsoft 免费提供的 Visual Studio 代码。

npm 安装


现在让我们看看安装 npm 的步骤。 npm 的官方网站是 https://www.npmjs.com/

NPM

步骤 1 : 转到网站中的“npm 入门”部分。

Get Started

步骤 2 : 在下一个屏幕中,根据操作系统选择要下载的安装程序。出于本练习的目的,请下载 Windows 64 位版本。

Choose Installer

步骤 3 : 启动安装程序。在初始屏幕中,单击下一步按钮。

Launch

步骤 4 : 在下一个屏幕中,接受许可协议并单击下一步按钮。

Accept

步骤 5 : 在下一个屏幕中,选择安装的目标文件夹,然后单击下一步按钮。

Destination Folder

步骤 6 : 在下一个屏幕中选择组件,然后单击下一步按钮。你可以接受默认安装的所有组件。

Default Installation

步骤 7 : 在下一个画面中,点击安装按钮。

Click Install

步骤 8 : 安装完成后,点击完成按钮。

Finish Button

步骤 9 :确认安装,在命令提示符下可以发出命令npm version。你将获得 npm 的版本号,如以下屏幕截图所示。

Screenshot

安装 Visual Studio 代码


以下是 Visual Studio Code 的特点:

  • 与 Visual Studio 的实际版本相比,轻量级编辑器。

  • 可用于编码语言,如 Clojure、Java、Objective-C 和许多其他语言。

  • 内置 Git 扩展。

  • 内置智能感知功能。

  • 更多的开发扩展。

Visual Studio 代码的官方网站是 https://code.visualstudio.com/

VisualStudio

步骤 1 : 下载完成后,请按照安装步骤操作。在初始屏幕中,单击下一步按钮。

Initial Screen

步骤 2 : 在下一个屏幕中,接受许可协议并单击下一步按钮。

Next

步骤 3 : 在下一个屏幕中,选择安装的目标位置,然后单击下一步按钮。

Destination Location

步骤 4 : 选择程序快捷方式的名称,点击下一步按钮。

Program Shortcut

步骤 5 :接受默认设置,点击下一步按钮。

Default Settings

步骤 6 :点击下一个画面中的安装按钮。

Setup

步骤 7 : 在最后的画面中,点击Finish按钮启动Visual Studio Code。

Final Screen

安装 Git


Git的一些关键特性是:

  • 易于分支和合并代码。
  • 准备在 Git 中使用许多技术来处理代码流。
  • 与其他 SCM 工具相比,Git 非常快。
  • 提供更好的数据保证。
  • 免费和开源。

Git 的官方网站是 https://git-scm.com/

Git

步骤 1 : 下载完成后,请按照安装步骤操作。在初始屏幕中,单击下一步按钮。

GNU Licence

步骤 2 : 选择需要安装的组件。你可以接受默认组件。

Default Components

步骤 3 : 下一步,选择程序快捷方式名称,点击下一步按钮。

GIT Shortcut

步骤 4 :接受默认的SSH可执行文件,点击下一步按钮。

Default SSH

步骤 5 :接受默认设置“Checkout Windows style, commit Unix style endings”,点击下一步按钮。

Default Setting

步骤 6 : 现在,接受终端模拟器的默认设置,点击下一步按钮。

Terminal

步骤 7 :接受默认设置,点击下一步按钮。

Accept Default Settings

步骤 8 :可以跳过实验选项,点击安装按钮。

Experimental Options

步骤 9 : 在最后的画面中,点击Finish按钮完成安装。

Complete Installation Process