angular 2.0 关于新版angular-cli的应用
1.以前写过一个webstorm借助angular-cli搭建angular2.0项目的博客。 后来许久没有接触过angular,现在拾起来的时候发现已经更新,用法变了。所以来记录下,以免其他友看到照成误区。
2.这也是说明一个道理,别人写下的东西你不一定适用,因为技术的东西说变就变,谁知道的。
基于Node环境,安装angular-cli。 新版的已经变成安装@angular/cli。所以安装时:npm install -d @angular/cli
那么问题来了,一大堆错误,说缺少pathon和visual studio。还有说版本不兼容的,所以建议node的版本不要太高,也不用太低。第一次我用的7以上的版本说不支持。然后换成6.0以上也是不支持。最后换成6.9几用的好好的。
并不是所有人的电脑安装都会出问题的。
既然说缺少pathon那就安装吧。推荐一个网友的解决办法,我也是参照这个解决的,就不重复啰嗦 http://www.cnblogs.com/liangxiaojie/p/4595406.html
说到底会出错的原因都是因为npm是国外的,需要FQ,会有那么一丝丝不稳定。
安装好angular/cli之后,就可以用ng命令啦。
例如:ng --version 查看版本号
ng help 帮助
当然最重要的还是用它创建工程。 ng new 工程名
然后会自动帮你创建所有的依赖,搭建成一个简单的模板,大概这样

node-modules会自动帮你创建,只是耗时比较长,建议一次下载多次copy。
运行项目试试,进入你的工程目录下,然后ng serve 默认是开启localhost:4200的。
所以浏览器里打开localhost:4200就可以啦。

这是最简单的项目啦,当然你可以继续创建命令

例如运行ng g c user

它是四个四个创建的,配套吗!!
这些文件工程太大了,运行时可以打压,ng serve --prod --aot 也是可以的。
好了就介绍这些基础的,其实后面的使用并没有改变太多啦
angular 2.0 关于新版angular-cli的应用的更多相关文章
- 全面支持Angular2的Web后台Bootstrap模板Sing App - Web & Angular 2.0 Dashboard
在线预览 Sing App v3.3.0 (包含Angular 2.0版本实现) 现在,本模板完全支持Angular2.0版本啦. Sing Web App 是由专业前端工程师采用行业内流行的技术构建 ...
- Angular 2.0 从0到1 (六)
第一节:Angular 2.0 从0到1 (一)第二节:Angular 2.0 从0到1 (二)第三节:Angular 2.0 从0到1 (三)第四节:Angular 2.0 从0到1 (四)第五节: ...
- 创建 Angular 8.0 项目
创建 Angular 8.0 项目,首先确保已经安装了 nodejs,如果没有安装,请看这篇文章安装:node.js 安装 1.新建一个空文件夹 angularproject,作为工作区 2.安装 A ...
- [从 0 开始的 Angular 生活]No.38 实现一个 Angular Router 切换组件页面(一)
前言 今天是进入公司的第三天,为了能尽快投入项目与成为团队可用的战力,我正在努力啃官方文档学习 Angular 的知识,所以这一篇文章主要是记录我如何阅读官方文档后,实现这个非常基本的.带导航的网页应 ...
- Angular 2.0 的设计方法和原则
转载自:Angular 2.0 的设计方法和原则 在开始实现Angular 2.0版本之际,我们认为应该着手写一些东西,告诉大家我们在设计上的考虑,以及为什么做这样的改变.现在把这些和大家一起分享,从 ...
- Angular从0到1:function(下)
1.前言 2.function(下) 2.13.angular.isArray(★★) angular.isArray用于判断对象是不是数组,等价于Array.isArray console.log( ...
- Angular从0到1:function(上)
1.前言 Angular作为最流行的前端MV*框架,在WEB开发中占据了重要的地位.接下来,我们就一步一步从官方api结合实践过程,来学习一下这个强大的框架吧. Note:每个function描述标题 ...
- [转贴]有关Angular 2.0的一切
对Angular 2.0的策略有疑问吗?就在这里提吧.在接下来的这篇文章里,我会解释Angular 2.0的主要特性区域,以及每个变化背后的动机.每个部分之后,我将提供自己在设计过程中的意见和见解,包 ...
- Angular 2.0 从0到1:Rx--隐藏在Angular 2.x中利剑
第一节:Angular 2.0 从0到1 (一)第二节:Angular 2.0 从0到1 (二)第三节:Angular 2.0 从0到1 (三)第四节:Angular 2.0 从0到1 (四)第五节: ...
随机推荐
- Vim 第一天
记得第一次接触vi编辑器,好像是在海尔的机房吧,那是时候还是没有毕业的小菜鸟一只(PS:现在也是菜鸟),记得是测试一个云存储的产品.看着他们用vi编辑器,当时也没有感觉有什么(现在也没感觉……),只是 ...
- HTML/CSS/Javascript调试入门(转)
推荐Chrome作为开发工具(FF可以使用FireBug,IE8和之后的版本也有自己的调试工具) 1.HTML的调试 将鼠标放在任意元素上,右键Inspect Element,即可查看该元素的HTML ...
- Chrome调试大全
作为一名前端开发者,打交道最多的可能是和浏览器.市面上各种浏览器多不胜数,主流的有Chrome,Firefox,Safari,IE,Opera,非主流的如360,遨游,QQ浏览器,搜狗浏览器,据说淘宝 ...
- 在web前端使用SVG
前言: 花了些时间了解了一下svg,然而仍然不怎么了解... 第一步:直接在html代码中使用svg. 首先了解几个标签: <svg version="1.1" xmlns= ...
- OGG数据仓库以及单向复制(二)
Configure Extract(提取) Process in Source system 配置capture(捕获)参数 Edit extract process parameter G ...
- 网格视图(GridView)功能和用法
GridView用于在界面上按行.列分布的方式来显示多个组件.GridView和ListView有共同的父类:AbsListView,因此GridView和ListView具有很高的相似性,它们都是列 ...
- 在ubuntu下增加root用户并登录
1.打开终端. 2.输入sudo gedit /usr/share/lightdm/lightdm.conf.d/50-ubuntu.conf 3.在弹出的编辑框里输入:greeter-show-ma ...
- 关于在官网上下载Eclipse遇到的问题!!
首先Eclipse是什么? Eclipse 是一个开放源代码的.基于Java的可扩展开发平台.就其本身而言,它只是一个框架和一组服务,用于通过插件组件构建开发环境. 幸运的是,Eclipse 附带了一 ...
- HDU4496(并查集)
D-City Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65535/65535 K (Java/Others)Total Subm ...
- [html5] 学习笔记-Canvas标签的使用
Canvas通过JavaScript来绘制2D图形.Canvas是逐像素渲染的.在Canvas中,一旦图形被绘制完成,它就不会继续得到浏览器的关注.如果其位置发生变化,那么整个场景也需要重新绘制,包括 ...