安装命令行

npm install -g @angular/cli

检查命令行

ng v

使用这个命令可以检查 angular cli是否安装成功。我检查的时候发现没有安装成功,提示我使用的node.js版本为6.9.2,不支持angular cli v6,至少需要node.js的版本在8.9以上,重新安装了最新的node.js后,angular cli才可以正常使用

创建项目

ng new app1

使用这个命令行会自动构建项目,大概需要5分钟左右的时间,流量需要大概100M左右

启动项目

cd app1

ng serve --open

启动以后,就可以访问http://localhost:4200访问项目了

创建及使用组件

ng generate component module1

或者使用简写

ng g c module1

创建完组件后,会在src/app文件夹创建一个module1的文件夹,并生成对应的文件,在module1.components.ts文件内有描述selector: 'app-module1'

那么在app.component.html文件就可以加入这么一句代码引入这个组件<app-module1></app-module1>

Angular CLI的安装及使用的更多相关文章

  1. Angular/cli的安装

    Angular cli 是一个命令行工具,用来创建,打包,发布项目. Angular cli 安装之前必须先安装Node 6.9.0及以上版本,NPM 3 及以上版本. 在cmd控制台窗口执行命令no ...

  2. Angular/cli 安装(windows环境)。

    1.卸载先前安装的Angular/cli npm uninstall -g angular-clinpm uninstall --save-dev angular-clinpm uninstall - ...

  3. angular 2 - 001 ng cli的安装和使用

    angular cli 创建项目和组件 ng new my-app --skip-install cd my-app cnpm install ng serve localhost:4200 angu ...

  4. 如何安装 Angular CLI 并且检查 CLI 的版本

    想在系统中安装 Angular CLI ,如何进行安装并且如何检查 CLI 的版本? 可以使用命令: npm install -g @angular/cli 进行安装. 使用命令 ng version ...

  5. 安装Angular CLI开发工具

    目前,无论你使用什么前端框架,都必然要用到NodeJS工具,Angular也不例外,与其他框架不同的是,Angular一开始就使用"全家桶"式的设计思路,因此@angular/cl ...

  6. 迈向angularjs2系列(8):angular cli和angular2种子项目

    文章目录 1.angular cli快速搭建项目 2.angular2-seed 3.手动配置 题外话:如何更好的阅读本篇文章 一: angular cli的安装 Angular-cli(命令行界面, ...

  7. .Net Core + Angular Cli / Angular4 开发环境搭建

    一.基础环境配置 1.安装VS 2017 v15.3或以上版本 2.安装VS Code最新版本 3.安装Node.js v6.9以上版本 4.重置全局npm源,修正为 淘宝的 NPM 镜像: npm  ...

  8. Angular CLI 命令行工具

    工欲善其事必先利其器.好的工具让开发更加简单便捷. 1.全局安装angular cli npm install -g @angular/cli 2.安装完成后就可以使用angular-cli命令行工具 ...

  9. .Net Core+Angular Cli/Angular4开发环境搭建教程

    一.基础环境配置1.安装VS2017v15.3或以上版本2.安装VSCode最新版本3.安装Node.jsv6.9以上版本4.重置全局npm源,修正为淘宝的NPM镜像:npminstall-gcnpm ...

随机推荐

  1. BZOJ 4726 POI 2017 Sabota? 树形DP

    4726: [POI2017]Sabota? Time Limit: 20 Sec  Memory Limit: 128 MBSec  Special JudgeSubmit: 128  Solved ...

  2. python开发_getpass_获取登录名

    我们有时候需要获取到计算机的登录名,这时候,就可以使用python中的getpass模块了 下面是我做的demo 运行效果: ===================================== ...

  3. UVALive 4423 String LD 暴力

    A - String LD Time Limit:3000MS     Memory Limit:0KB     64bit IO Format:%lld & %llu Submit Stat ...

  4. leetcode659. Split Array into Consecutive Subsequences

    leetcode659. Split Array into Consecutive Subsequences 题意: 您将获得按升序排列的整数数组(可能包含重复项),您需要将它们拆分成多个子序列,其中 ...

  5. DOM-XML(解析与创建)

    /** * 读取(解析)xml文件 * @author Administrator * */ public class DOMRead { public static void main(String ...

  6. Running multiple instances of Xamarin Studio on a Mac

    I love developing software on my MacBook Air! I got the latest version with the maximum possible spe ...

  7. Unity知识结构总结

    前言 本篇以知识结构图的形式对Unity引擎的常用基础知识内容进行了总结和梳理. 如果你学了一点关于Unity引擎的知识,又觉得太杂乱,那么希望本篇会给你一些帮助. 对应引擎版本:Unity  4.6 ...

  8. 【ELK】【docker】【elasticsearch】1. 使用Docker和Elasticsearch+ kibana 5.6.9 搭建全文本搜索引擎应用 集群,安装ik分词器

    系列文章:[建议从第二章开始] [ELK][docker][elasticsearch]1. 使用Docker和Elasticsearch+ kibana 5.6.9 搭建全文本搜索引擎应用 集群,安 ...

  9. Selenium2+python自动化44-元素定位参数化(find_element)

    前言 元素定位有八种方法,这个能看到这一篇的小伙伴都知道了,那么有没有一种方法,可以把八种定位合为一种呢?也就是把定位的方式参数化,如id,name.css等设置为一个参数,这样只需维护定位方式的参数 ...

  10. cocos2d-x 3.0 事件处理

    參考文章: star特530的CSDN博客:http://blog.csdn.net/star530/article/details/18325493 https://github.com/chuko ...