VSCode+Node.js+Angular2开发环境

[版权声明] 本站内容采用 知识共享署名-非商业性使用-相同方式共享 3.0 中国大陆 (CC BY-NC-SA 3.0 CN) 进行许可。
部分内容和资源来自网络,纯学习研究使用。如有侵犯您的权益,请及时联系我,我将尽快处理。
如转载请注明来自: Dreamlike博客,本文链接: VSCode+Node.js+Angular2开发环境

前不久Angular2发布了正式版,而且Angular4不会颠覆式改变语法(对比Angular1和Angular2),所以感觉不会坑的情况下,决定学习Angular2。第一件事当然是搭建个开发环境,但是网上的教程不是很多或者版本比较旧,不适用当前,最后自己摸索出来了:

其他相关博文:

VSCODE+PYTHON开发环境

VSCODE+CPP开发环境

VSCODE+GOLANG开发环境

一、测试环境

  • Windows 10
  • VSCode   v1.11.1
  • Node.js   v6.10.2
  • NPM   v3.10.10
  • tsc   v2.2.2

二、安装Node.js、NPM、TSC

直接去官网下载安装包:https://nodejs.org/en/download/ 

安装好之后,打开命令提示符:Win+R -> cmd ,然后安装tsc,

vscode+nodejs+angular2-0

三、安装Visual Studio Code

同样去官网下载VSCode并安装: https://code.visualstudio.com/Download

四、下载Angular2提供的quickstart

官网提供的文档:https://angular.cn/docs/ts/latest/guide/setup.html

五、VSCode中配置运行环境

首先在VSCode的资源管理器,打开quickstart文件夹。

按F1键,出来输入框后,输入launch,选择“打开launch.json”,编辑

注意:cwd后面要加上 / 斜杠,不然最后运行的时候会找不到路径。(至少我测试是这样)

按F1键,出来输入框后,输入task,选择“配置任务运行程序”,再选择“TypeScript - Watch Mode”,编辑

vscode+nodejs+angular2-1

六、运行程序

此时已经算是配置完成了,按F5运行可以看到效果:

vscode+nodejs+angular2-2

 

参考链接:《Getting Started With Angular 2 Application Using Visual Studio Code

如果本文对您有所帮助,可以请作者喝杯咖啡,感谢支持^_^

支付宝支付
微信支付

《VSCode+Node.js+Angular2开发环境》有3个想法

发表评论

电子邮件地址不会被公开。 必填项已用*标注