先导目录
1- 安装WebStorm2017.1
2- 安装node.js
3- 安装Angular2(typescript)
4- 创建WebStorm Project
一、 安装WebStorm2017.1
利用WebStorm2017.1开发,需要Angular2或者高版本的node.js(好像4以上)。
废话:
1)先说下WebStorm 是什么?
通过安装必要的语言插件,起到一个很好的整理脚本结构、code error 提示、错误定位的一个轻便的Web开发工具。
它支持很多前端开发语言,我们这里是Angular2(typeScript).
2) 软件下载和激活
2.1) 下载地址:https://www.jetbrains.com/products.html?fromMenu 不要直接点首页下载,点All tools 然后选择javascript 语言选项。
2.2) 激活
激活是在安装过程中用到的。
选择“license server” 输入:http://idea.imsxm.com/
3) 安装WebStorm2017.1
默认安装就可以了。(哈哈,不截图了)
二、 安装node.js
1) 下载地址: 官网https://nodejs.org/en/
选择推荐即可。
2)安装node.js
过程就略了,跟一般的软件安装一样,傻瓜式的。
验证:
3) 配置node.js
3.1)设置prefix和cache
打开cmd
执行以下两行:
npm config set prefix "C:Program Files
odejs
ode_global"
npm config set cache "C:Program Files
odejs
ode_cache"
3.2)配置环境变量:
A- 配置系统变量
NODE_PATH C:Program Files odejs ode_global ode_modules
B- 配置用户变量
PATH 中添加 C:Program Files odejs ode_global
验证:
三、安装Angular2(typescript)
1)安装Angular2
三个命令:
A- 全局安装cnpm (来源于阿里的资料库)
npm install -g cnpm --registry=https://registry.npm.taobao.org
B- 全局安装typescript(基础依赖语言)
npm install -g typescript typings
C- 全局安装@Angular/cli(Angular2)
npm install -g @angular/cli
(如果下载完,出现可选项依赖没有完成,等待程序自动结束即可,先不管)
四、创建WebStorm Project
File----->New------>Project
wenstorm自动检索CLI目录
刚载入的时候会出现以下画面, 没有发现node_modules.
那是因为你新建的project需要载入package.
载入完成以后就是这样的:
然后右键点击
选择"show npm Scripts"
双击start
APP运行地址
http://localhost:4200