用WebStorm进行Angularjs 2的开发
环境准备:
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的开发的更多相关文章
- AngularJS最理想开发工具WebStorm
http://blog.fens.me/angularjs-webstorm-ide/ Angularjs插件下载地址:http://plugins.jetbrains.com/plugin/6971 ...
- 黄聪:AngularJS最理想开发工具WebStorm
Aug 29, 2013 Tags: angularangular.jsangularjswebstorm Comments: 23 Comments AngularJS最理想开发工具WebStorm ...
- 搭建 AngularJS+Ionic+Cordova 开发环境并运行一个demo
目前的手机APP有三类:原生APP,WebAPP,HybridApp:HybridApp结合了前两类APP各自的优点,越来越流行. Cordova就是一个中间件,让我们把WebAPP打包成Hybrid ...
- 20个免费的 AngularJS 资源和开发教程
曾经,jQuery 无疑是最受欢迎的开源的 JavaScript 库,如今它有了很多的竞争对手,像 AngularJS.React.KnockoutJS 等等.在这里,我想重点关注一下 Angular ...
- linux-mint下搭建android,angularjs,rails,html5开发环境 - qijie29896的个人空间 - 开源中国社区
linux-mint下搭建android,angularjs,rails,html5开发环境 - qijie29896的个人空间 - 开源中国社区 http://blog.csdn.net/orzor ...
- Cordova+Angularjs+Ionic 混合开发入门讲解
作为一名学习Android开发的学生,对于移动开发的发展趋势颇为关注,大家都知道,现在原生的移动开发在企业上基本很少使用了,大部分企业为了降低成本,选择了webapp,hybrid(混合开发)这两种模 ...
- AngularJS + CoffeeScript 前端开发环境配置详解
AngularJS 号称 '第一框架' ('The first framework') 确实是名不虚传.由其从jQuery中完全转入AngularJS后就有无法离开他的感觉了.虽然AngularJS的 ...
- angularJS实用的开发技巧
一.开端 真的是忙完这一阵子就可以忙下一阵子了啊... 最近在做一个angularJS+Ionic的移动端项目...记录一些技巧,方便自己以后查阅,也方便需要的人可以看一看...^_^ 二.基础原则了 ...
- [整理]AngularJS移动端开发遇到的问题
最近在开发一个移动WebAPP的小项目,因为之前一直使用AngularJS, 对于这个项目,废话不多说,拿过来就用上了. 开发过程是一路通畅和舒服的,但是,却忽略了一个非常重要的问题,移动2G环境下的 ...
随机推荐
- 鼠标经过事件(onmouseover)
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...
- 设计模式(八)Proxy Parttern 代理模式
核心作用: 通过代理,控制对对象的访问 可以详细控制某个对象的方法,在调用这个方法做前置处理,调用这个方法后做后置处理(AOP的微观实现) AOP(Aspect Oriented Programmin ...
- 大数据新手之路二:安装Flume
Ubuntu16.04+Flume1.8.0 1.下载apache-flume-1.8.0-bin.tar.gz http://flume.apache.org/download.html 2.解压到 ...
- jGrid + echart 后台管理
用来初始化表的大小: $(select_dom).jqGrid( 'setGridWidth', parent_column.width() ); 表的大小随着页面的宽度变化: $(window).o ...
- 有效利用1 on 1
2019-01-08 16:32:13 感觉1 on 1是浪费时间? 感觉1 on 1时没啥好说? 感觉老板总是不想1 on 1? 怎样才能 升职加薪? 一切都从有效的1 on 1开始!! 什么是1 ...
- Nginx的安装和使用(Linux)
关于什么是Nginx,Nginx的优势和使用范围这里就不多说了.其实它就是一个web服务器.这篇文章主要是说Nginx的安装和使用. 安装方式有yum安装和源码安装,这里主要讲源码安装 1.安装依赖, ...
- spring容器bean的作用域 & spring容器是否是单例的一些问题
Spring容器中Bean的作用域 当通过Spring容器创建一个Bean实例时,不仅可以完成Bean实例的实例化,还可以为Bean指定特定的作用域.Spring支持如下5种作用域: singleto ...
- You Don't Know JS: this & Object Prototypes( 第4章 Mixing "Class" Objects)
本章移到“Object oriented programming”和"classes". 看‘class orientation‘ 的设计模式: instantiation, in ...
- 11月27日 招聘网第七部分,.gitignore的用法。
回想Rails --Active Record Query Interface--Scopes的基本用法: 1.Passing in arguments.例子:scope :name , -> ...
- addEventListener调用带参数函数
当传递参数值时,使用"匿名函数"调用带参数的函数: <body> <button id="btn">click me</butto ...