安装命令行

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. 趁热打铁学node

    前言 不废话直接官网下载安装. windows安装很简单,双击ok. 完成后命令行输入node -v. 会提示版本号,说明安装成功(Node.js 还自动附带安装了 npm,类似ruby的gem). ...

  2. Git_简介

    Git是什么? Git是目前世界上最先进的分布式版本控制系统(没有之一). Git有什么特点?简单来说就是:高端大气上档次! 那什么是版本控制系统? 如果你用Microsoft Word写过长篇大论, ...

  3. PHP实现文件下载的核心代码

    PHP实现文件下载的核心代码:

  4. 英特尔老款CPU支持虚拟化对照表（转）

    说明:一般来说新款的挤牙膏公司出的CPU都基本支持虚拟化,但不包括Atom系列的,也就是小主机低功耗机器使用的CPU. Intel® Virtualization Technology List YE ...

  5. AWR--service statistics

    近期发现一个奇怪的现象,数据库报告上看负载非常高.可是cpu和等待事件都非常低,不知道消耗的资源跑到哪里去了? Snap Id Snap Time Sessions Cursors/Session B ...

  6. F​l​e​x​4​+​s​p​r​i​n​g​+​h​i​b​e​r​n​a​t​e​+​B​l​a​z​e​D​S​整合案例

    http://wenku.baidu.com/link?url=7v5xAyD2nvChQRT60QewpvAASFHMZNvD0OxX11OASYvae8jbVNsr5I000TwwYOlChzq0 ...

  7. 免费的Bootstrap管理后台模板集合

    Free Bootstrap Admin Templates for Designers 1. Admin Lite AdminLTE - 是一个完全响应式管理模板.基于Bootstrap3的框架.高 ...

  8. AFNetworking 2.0使用(持续更新)

    本人视频教程系列 导入AFNetworking 2.0 文件夹,引入头文件AFNetworking.h --------------- *使用NSURLSessionDownloadTask来下载一张 ...

  9. 如何获取隔壁wifi密码，非暴力破解

    目前常见的Wi-Fi加密方式有WEP.WPA2和WPS(链接为各自的破解方式),不过有网友反映以往破解WPA2的方法耗时太长,而且不适用于所有WPS启动的接入点.而今天介绍的这种方法则更加省时省力. ...

  10. MICS：副本和纠删码混合存储系统

    摘要 云存储系统的三个指标: 高可靠性,低存储开销,高读写性能. 这三个指标是没有办法同一时候满足的,许多时候须要进行tradeoff. 副本系统和纠删码是两种在存储系统中广泛使用的策略,它们在保证高 ...