Angular4-在线竞拍应用-开发环境的搭建

港控/mmm° 2022-06-06 05:27 81阅读 0赞

安装Nodejs，Angular CLI，WebStorm

## 安装Node.js ##

去Node.js的官网，[https://nodejs.org/en/][https_nodejs.org_en]，点击下载按钮，node-v6.11.3-x64.msi，直接下一步下一步安装即可，软件会自动写入环境变量中，这样就能直接在cmd命令窗口中直接使用node或npm（包管理工具）命令。

安装完后执行`node -v`，会显示出其版本号，代表安装成功。

Angular 4.0基于node.js，所有要先安装nodejs环境。

## 安装cnpm ##

npm是一个包管理工具。由于npm安装插件是从国外服务器下载，受网络影响很大，可能出现异常，继而淘宝团队生产一个完整的npmjs.org镜像，用cnpm代替npm,cnpm与nodejs的npm用法一致,只是在执行命令时，将npm改为cnpm。

在cmd命令窗口中输入，然后回车

npm install cnpm -g --registry=https://registry.npm.taobao.org

安装完毕时候输入`cnpm -v`,查看是否安装成功。

## 安装TypeScript和typings ##

angular-cli是用TypeScript写的，所以需要安装TypeScript和typings。

输入

cnpm install –g typescript@2.2.2 typings

安装完后输入`tsc -v`，出现版本号即安装成功。

## 安装 angular-cli ##

cnpm install –g @angular/cli@1.0.0

之后输入`ng -v`，出现版本号即安装成功。

ng即为angular。

设置cnpm为默认的包管理工具

ng set --global packageManager=cnpm

## 安装WebStorm ##

去官网下载WebStorm-2017.2.4.exe，在License server中输入[http://idea.imsxm.com/][http_idea.imsxm.com]，来激活软件。

## 新建项目 ##

在命令行中进入到自己想建项目的文件夹中，执行下面的命令，ng就是Angular的缩写

ng new auction

auction是项目的名称。

之后会创建项目的基本文件，然后下载项目所依赖的node.js包。默认是用npm从外国网站下载资源，下载速度极慢。所以基本文件下载完毕后，ctr+c，终止进程，然后用cnpm下载包。如果前面设置cnpm为默认的包管理工具，就会默认从cnpm下载了。

## 安装依赖的node.js包 ##

进入到auction文件夹，然后执行`cnpm install`。之后就会下载大概100多兆的东西。

之后会在auction中多出一个node\_modules文件，这个里边就是下载的那些包。

[https_nodejs.org_en]: https://nodejs.org/en/
[http_idea.imsxm.com]: http://idea.imsxm.com/

发表评论取消回复

表情：

评论列表（有 0 条评论，81人围观）

还没有评论，来说两句吧...

相关阅读

相关 Angular4-在线竞拍应用-与服务器通信

创建web服务器使用Nodejs创建服务器使用Express创建restful的http服务监控服务器文件的变化用webstorm建立一个名为se

女爷i/ 2022年06月06日 05:58/ 0 赞/ 208 阅读

相关 Angular4-在线竞拍应用-ngContent指令

ngContent指令新建项目demo6 新建组件ng g component child 投影，在某些情况下，需要动态改变模板的内容，可以用路由，但路由是一个相对

ゞ浴缸里的玫瑰/ 2022年06月06日 05:58/ 0 赞/ 198 阅读

相关 Angular4-在线竞拍应用-组件间通信

angular应用就是一个组件树要创建松耦合的组件组件通信的例子新生成一个项目ng new demo2 或者通过webstorm，File，New，Proj

ゝ一纸荒年。/ 2022年06月06日 05:57/ 0 赞/ 210 阅读

相关 Angular4-在线竞拍应用-管道

<p>我的生日是{ { birthday}}</p> birthday:Date=new Date(); 显示结果为我的生日是Sun Oct 0

ゝ一纸荒年。/ 2022年06月06日 05:57/ 0 赞/ 209 阅读

相关 Angular4-在线竞拍应用-响应式编程

![这里写图片描述][SouthEast] 可观察者Observable（流）：表示一组值或者事件的集合观察者Observer：一个回调函数的集合，它知道怎样去

àì夳堔傛蜴生んèń/ 2022年06月06日 05:41/ 0 赞/ 193 阅读

相关 Angular4-在线竞拍应用-依赖注入

依赖注入：Dependency Injection 简称DI 注入器 constructor(private productServie:ProductServic

向右看齐/ 2022年06月06日 05:40/ 0 赞/ 236 阅读

相关 Angular4-在线竞拍应用-路由

angular是单页应用需要配置路由来实现页面跳转。 ![这里写图片描述][SouthEast] ![这里写图片描述][SouthEast 1] 路由的例子通

桃扇骨/ 2022年06月06日 05:36/ 0 赞/ 209 阅读

相关 Angular4-在线竞拍应用-项目启动过程

查看.angular-cli.json { "$schema": "./node_modules/@angular/cli/lib/config/sche

冷不防/ 2022年06月06日 05:28/ 0 赞/ 207 阅读

相关 Angular4-在线竞拍应用-开发环境的搭建

安装Nodejs，Angular CLI，WebStorm 安装Node.js 去Node.js的官网，[https://nodejs.org/en/][https_n

港控/mmm°/ 2022年06月06日 05:27/ 0 赞/ 82 阅读

相关 Angular4-在线竞拍应用-开发组件

在线竞拍项目要开发七个组件 ![这里写图片描述][SouthEast] 执行命令`ng g component navbar`生成导航栏组件。(这个命令的全称是ng ge

Dear 丶/ 2022年06月05日 21:16/ 0 赞/ 224 阅读