tip:所有的命令是红色标签 , 链接为蓝色标签

使用ng-cli创建新的项目一般需要安装一些新的东西后才可以进行创建成功

1.需要先安装node.js  链接: https://nodejs.org/ 找到合适自己电脑的版笨,进行下载安装

2.安装完成之后,在开始菜单中输入cmd 进入命令,输入node -v  查看是否安装成功,如果安装成功会出现版本信息,最新的node.js集成了npm,也就是说安装好了node同时npm也安装好了,同时,输入 npm -v 查看版本信息

3.当确认本机安装好node.js之后,可以使用npm 进行安装typeScript  npm install -g typeScript

接下来安装ng-cli

4.npm install -g @angular/cli

5.验证是否安装成功 检测命令:ng version  系统会自动输出版本信息:

@abgular/cli:1.1.1 版本信息

node:7.00

os:darwin 64

5.安装好ng-cli之后就需要安装新的项目,要知道你是否有项目的目录,如果有项目的目录就需要使用ng init 的命令来新建,如果没有则需要使用 ng new +新的项目

  ng init 在当前的目录中常见新的应用

  ng new 创建新的目录,然后在新的目录中运行ng init 命令

  • 这里在不知道是否创建了目录的时候使用 ng init 如果出现报错的情况下,则是表示没有已创建的目录,则需要改为 ng new +新的项目名称

当运行ng new的时候出现以下操作

  1) 新的项目目录被创建

  2)项目的源文件和目录将会被创建

  3)项目的所有依赖【package.json中配置的依赖性】也会自动被创建

  4)自动配置好项目中的typeScript开发环境和karma单元测试环境以及peotractor测试环境

  5)environment相关文件进行初始化

6 使用命令进入到新建的文件项目中

  cd +刚才新建的项目中

7.项目运行: ng serve

在这里的时候输入的命令之后,可能会存在输入命令无法在输入进去,需要使用ctrl+D一次 或  ctrl+C两次 或输入“ .exit”命令调出,会给出响应的显示,这是只要进行对应提示输出即可

8.在浏览器中输入localhost:4200 进行查看项目创建成功

9.在创建目录中可以使用 tree 查看项目结构

  

ng-cli新建项目的更多相关文章

  1. angular开发环境搭建及新建项目

    最近一个星期准备学习一下angular前端框架,因为之前在学习abp框架的时候,都要求前端要掌握angular,所以不得不回来恶补一下了,学习的过程有时间的话会记录在这里,方便以后复习. 闲言少叙,下 ...

  2. angular6新建项目

    mkdir  angular6project cd angular6project ng new demo      新建一个普通项目 ng new demo --routing  新建一个带路由的项 ...

  3. vue新建项目

    一直都被如何用vue.js新建一个项目的问题困扰着,经过好久的实践,终于搞清楚如何用vue新建项目了: 1.官网对于vue-cli介绍: Vue.js provides an official CLI ...

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

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

  5. Angular-cli新建项目目录结构详解

    Angular-cli新建项目目录结构详解 在上一篇博客中我们已经通过Angular CLI命令行工具创建出来一个全新的Angular项目,要想写项目,首先我们要先搞清楚项目的目录结构是怎样的,每个文 ...

  6. angular - 新建项目 - 2

    ng new testNg 新建项目后,从网络上拉取模板(最后缓存下来,我们下次创建项目的时间将会减少80%) 安装过程中,需要我们提供Git账号和姓名 最后,我们进入 useNg 然后,启动服务器 ...

  7. vue3.x版本新建项目相关知识和注意事项

    前言你前提应该懂下面基础知识:下载node.js 下好后自带npm 命令 终端查看命令 npm -v 即可看到安装版本安装淘宝镜像:npm install -g cnpm --registry=htt ...

  8. 第六十八篇:vue-cli新建项目

    好家伙,之前只是一股脑得用,连里面的可选配置项都不清楚,今天来把它搞清楚 1.单页面应用 1.1.什么是单页面应用程序 单页面应用程序(英文名: Single Page Application)简称S ...

  9. 每次新建项目出现appcompat_v7 解决方法

    ADT升级版本后每次新建项目出现appcompat_v7 , 解决方案如下 问题生成:

  10. MVC3 新建项目

    一.安装工具 二.新建项目 step1:新建MVC3项目 打开新建项目窗口,在“已安装的模板”列表中选择“Web”,在右侧应用程序模板列表中选择“ASP.NET MVC3 Web应用程序”,修改项目名 ...

随机推荐

  1. 一位996、CRUD开发者的一天

    记一笔流水账 今天我打算记一笔流水账,主要记录我的一天中干的事情,并思考效率低下的原因,同时分析一些可用的解决方案. 清早·开始做计划 早上六点四十,被梦想唤醒,然后看一会书,吃早餐,送娃上学. 九点 ...

  2. 【转载】Windows api数据类型

    最近在接触windows api函数,看到了很多之前没有看到过的数据类型,发现“个人图书馆”中有个帖子说的挺详细的,特地搬运过来 Windows 数据类型 Delphi 数据类型 描述 LPSTR P ...

  3. D-Distance_2019牛客暑期多校训练营(第八场)

    题目链接 Distance 题意 1<=nmh,q<=1e5 q个操作 1 x y z往坐标里加入一个点 2 x y z查询距离该点最近的点的距离(曼哈顿距离) 题解 做法一 将要插入的点 ...

  4. 2019 ICPC南京网络预选赛 I Washing clothes 李超线段树

    题意:有n个人,每个人有一件衣服需要洗,可以自己手洗花费t时间,也可以用洗衣机洗,但是洗衣机只有一台,即每个时刻最多只能有·一个人用洗衣机洗衣服.现在给你每个人最早可以开始洗衣服的时间,问当洗衣机的洗 ...

  5. Codeforces Round #503 (by SIS, Div. 2) D. The hat -交互题,二分

    cf1020D 题意: 交互题目,在有限的询问中找到一个x,使得数列中的第x位和第(x+n/2)位的值大小相同.数列保证相邻的两个差值为1或-1: 思路: 构造函数f(x) = a[x] - a[x ...

  6. 牛客练习赛22C Bitset

    牛客练习赛22C 一共有 n个数,第 i 个数是 xi  xi 可以取 [li , ri] 中任意的一个值. 设 ,求 S 种类数. 感觉二进制真是一个神奇的东西. #include <iost ...

  7. hihocoder #1616 : 是二叉搜索树吗?(模拟题)

    题目链接:http://hihocoder.com/problemset/problem/1616 题解:就是简单的模拟一下至于如何判断是不是二叉搜索树可以通过中序遍历将每个点存下来看是不是递增的如果 ...

  8. 牛客网 湖南大学2018年第十四届程序设计竞赛重现赛 A game

    链接:https://www.nowcoder.com/acm/contest/125/A来源:牛客网 Tony and Macle are good friends. One day they jo ...

  9. hive正则表达式的用法

    regexp_replace用法 1.  截取字符串中的汉字部分: 举个栗子:select regexp_replace('七夕节comming!来啦','([^\\u4E00-\\u9FA5]+)' ...

  10. 【Offer】[18-1] 【在O(1)时间内删除链表节点】

    题目描述 思路分析 测试用例 代码链接 题目描述 给定单向链表的头指针和一个结点指针,定义一个函数在O(1)时间删除该结点. 思路分析 一般我们删除单链表中的节点是需要遍历链表,找到要删除节点的前一个 ...