环境准备:

WebStorm开发工具  https://pan.baidu.com/s/1o8maQLG  提取密码(加群获取599606903)

nodejs  https://nodejs.org/en/download/

angular-cli

window

1.WebStorm安装

2.nodejs安装

(1)下载Windows版的Nodejs,进行按照提示安装即可

如果正常显示版本号,即安装成功。

(2)nodejs配置

Nodejs安装完成之后,默认会将node.exe的路径,添加到系统的环境变量中,如果没有请手动添加。除此之外还要进行其他的配置

1、配置prefix和cache目录

d:\node

npm config set prefix "d:\node\node_global"

npm config set cache "d:\node\node_cache"

2、配置环境变量

计算机->属性->高级系统设置->环境变量

在系统变量中设置node_path

新建 变量名  NODE_PATH   变量值 D:\node\node_global\node_modules

这个值就是上一步中,通过 “npm config set prefix” 设置的值。可以,用下面命令查看

npm config get prefix

在用户变量修改path

path  D:\node\node_global\

3、配置sass_binary

angular cli 是要依赖node-sass的,默认情况下,不会像其它包一样直接下载,而是要下载后进行编译的。在Windows下,首先要通过git下载win32-x64-51_binding.node,但是不知道是被墙还是什么原因,下不下来,就会导致后面的编译出错,以及提示找不到python和Visual Studio的问题,手动下载相应的版本https://github.com/sass/node-sass/releases/

将下载的binding.node放到指定目录,例如:

D:\node\darwin-x64-11_binding.node

配置路径:用过命令配置

npm config set sass_binary_site “https://npm.taobao.org/mirrors/node-sass/” //使用阿里的镜像

npm config set sass_binary_path “D:\node\darwin-x64-11_binding.node”

(3)安装工具包

1、全局安装阿里cnpm

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

2、全局安装typescript

npm install -g typescript typings

3、全局安装angular-cli

npm install -g @angular/cli

创建工程

1、打开webStorm新建angular cli工程

运行:

用WebStorm进行Angularjs 2的开发的更多相关文章

  1. AngularJS最理想开发工具WebStorm

    http://blog.fens.me/angularjs-webstorm-ide/ Angularjs插件下载地址:http://plugins.jetbrains.com/plugin/6971 ...

  2. 黄聪:AngularJS最理想开发工具WebStorm

    Aug 29, 2013 Tags: angularangular.jsangularjswebstorm Comments: 23 Comments AngularJS最理想开发工具WebStorm ...

  3. 搭建 AngularJS+Ionic+Cordova 开发环境并运行一个demo

    目前的手机APP有三类:原生APP,WebAPP,HybridApp:HybridApp结合了前两类APP各自的优点,越来越流行. Cordova就是一个中间件,让我们把WebAPP打包成Hybrid ...

  4. 20个免费的 AngularJS 资源和开发教程

    曾经,jQuery 无疑是最受欢迎的开源的 JavaScript 库,如今它有了很多的竞争对手,像 AngularJS.React.KnockoutJS 等等.在这里,我想重点关注一下 Angular ...

  5. linux-mint下搭建android,angularjs,rails,html5开发环境 - qijie29896的个人空间 - 开源中国社区

    linux-mint下搭建android,angularjs,rails,html5开发环境 - qijie29896的个人空间 - 开源中国社区 http://blog.csdn.net/orzor ...

  6. Cordova+Angularjs+Ionic 混合开发入门讲解

    作为一名学习Android开发的学生,对于移动开发的发展趋势颇为关注,大家都知道,现在原生的移动开发在企业上基本很少使用了,大部分企业为了降低成本,选择了webapp,hybrid(混合开发)这两种模 ...

  7. AngularJS + CoffeeScript 前端开发环境配置详解

    AngularJS 号称 '第一框架' ('The first framework') 确实是名不虚传.由其从jQuery中完全转入AngularJS后就有无法离开他的感觉了.虽然AngularJS的 ...

  8. angularJS实用的开发技巧

    一.开端 真的是忙完这一阵子就可以忙下一阵子了啊... 最近在做一个angularJS+Ionic的移动端项目...记录一些技巧,方便自己以后查阅,也方便需要的人可以看一看...^_^ 二.基础原则了 ...

  9. [整理]AngularJS移动端开发遇到的问题

    最近在开发一个移动WebAPP的小项目,因为之前一直使用AngularJS, 对于这个项目,废话不多说,拿过来就用上了. 开发过程是一路通畅和舒服的,但是,却忽略了一个非常重要的问题,移动2G环境下的 ...

随机推荐

  1. 一篇很好的java异常框架讲解

    https://www.cnblogs.com/itcui/p/6400499.html 其实原作者是csdn的一名博主,实在受不了csdn的广告,所以就摘录这篇

  2. [转]QT中QString与string的转化,解决中文乱码问题

    QString str2qstr(const string str) { return QString::fromLocal8Bit(str.data()); } string qstr2str(co ...

  3. Java String常用的两个方法

  4. 记录Python类与继承的一个错误

    今天在学python的类与继承的时候遇到一个错误,原来是自己在ctrl+c  ctrl+v的时候漏了一个括号 class Car(): def __init__(self,make,year,mode ...

  5. 学习笔记32—python常见问题及解决办法

    1.Anaconda3 中 Spyder 无法打开/点击没有反应 应对方法 1).通过pip安装pyqt5:pip install pyqt5 2).输入以下命令:spyder --new-insta ...

  6. Spring Cloud 入门教程(四): 分布式环境下自动发现配置服务

    前一章, 我们的Hello world应用服务,通过配置服务器Config Server获取到了我们配置的hello信息“hello world”. 但自己的配置文件中必须配置config serve ...

  7. AtCoder Regular Contest 103 E Tr/ee

    Tr/ee 思路:按照下图所示连接 代码: #pragma GCC optimize(2) #pragma GCC optimize(3) #pragma GCC optimize(4) #inclu ...

  8. [MySQL]典型的行列转换

    列变成行 测试数据库数据样式: 应用的sql语句: SELECT TM,NAME,SUM(GE) AS 'GE',SUM(GD) AS 'GD',SUM(CT) AS 'CT',SUM(NUM) AS ...

  9. 日常英语---十一、MapleStory/Monsters/Level 201-210(Dark Demon Eagle Rider)

    日常英语---十一.MapleStory/Monsters/Level 201-210(Dark Demon Eagle Rider) 一.总结 一句话总结:骑着鹰的快速飞行的恶魔,进入地图后跟着你. ...

  10. Python 编程快速上手 第六章总结

    第六章 字符串操作 前言 这一章节讲了关于 Python 中字符串类型的知识.与字符串有关的操作符,方法等等. 处理字符串:字符串的写入.打印.访问的知识 原始字符串 格式:r'string'作用:在 ...