ng-cli新建项目
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新建项目的更多相关文章
- angular开发环境搭建及新建项目
最近一个星期准备学习一下angular前端框架,因为之前在学习abp框架的时候,都要求前端要掌握angular,所以不得不回来恶补一下了,学习的过程有时间的话会记录在这里,方便以后复习. 闲言少叙,下 ...
- angular6新建项目
mkdir angular6project cd angular6project ng new demo 新建一个普通项目 ng new demo --routing 新建一个带路由的项 ...
- vue新建项目
一直都被如何用vue.js新建一个项目的问题困扰着,经过好久的实践,终于搞清楚如何用vue新建项目了: 1.官网对于vue-cli介绍: Vue.js provides an official CLI ...
- angular 2 - 001 ng cli的安装和使用
angular cli 创建项目和组件 ng new my-app --skip-install cd my-app cnpm install ng serve localhost:4200 angu ...
- Angular-cli新建项目目录结构详解
Angular-cli新建项目目录结构详解 在上一篇博客中我们已经通过Angular CLI命令行工具创建出来一个全新的Angular项目,要想写项目,首先我们要先搞清楚项目的目录结构是怎样的,每个文 ...
- angular - 新建项目 - 2
ng new testNg 新建项目后,从网络上拉取模板(最后缓存下来,我们下次创建项目的时间将会减少80%) 安装过程中,需要我们提供Git账号和姓名 最后,我们进入 useNg 然后,启动服务器 ...
- vue3.x版本新建项目相关知识和注意事项
前言你前提应该懂下面基础知识:下载node.js 下好后自带npm 命令 终端查看命令 npm -v 即可看到安装版本安装淘宝镜像:npm install -g cnpm --registry=htt ...
- 第六十八篇:vue-cli新建项目
好家伙,之前只是一股脑得用,连里面的可选配置项都不清楚,今天来把它搞清楚 1.单页面应用 1.1.什么是单页面应用程序 单页面应用程序(英文名: Single Page Application)简称S ...
- 每次新建项目出现appcompat_v7 解决方法
ADT升级版本后每次新建项目出现appcompat_v7 , 解决方案如下 问题生成:
- MVC3 新建项目
一.安装工具 二.新建项目 step1:新建MVC3项目 打开新建项目窗口,在“已安装的模板”列表中选择“Web”,在右侧应用程序模板列表中选择“ASP.NET MVC3 Web应用程序”,修改项目名 ...
随机推荐
- 【管理学】PDCA
- 2018中国大学生程序设计竞赛 - 网络选拔赛 hdu 6440 Dream 模拟
Dream Time Limit: 12000/6000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others)Total Subm ...
- Codeforces 734C. Anton and Making Potions(二分)
Anton is playing a very interesting computer game, but now he is stuck at one of the levels. To pass ...
- 【JavaScript】吃饱了撑的系列之JavaScript模拟多线程并发
前言 最近,明学是一个火热的话题,而我,却也想当那么一回明学家,那就是,把JavaScript和多线程并发这两个八竿子打不找的东西,给硬凑了起来,还写了一个并发库concurrent-thread-j ...
- spring MVC的流程
spring MVC的工作流程
- IOS集成JPush
本篇文章采用Xcode手动集成JPush 证书 参考网址:https://docs.jiguang.cn//jpush/client/iOS/ios_cer_guide/ 下载SDK 下载网址:htt ...
- FreeSql (二十九)Lambda 表达式
FreeSql 支持功能丰富的表达式函数解析,方便程序员在不了解数据库函数的情况下编写代码.这是 FreeSql 非常特色的功能之一,深入细化函数解析尽量做到满意,所支持的类型基本都可以使用对应的表达 ...
- 使用vitamio长时间播放崩溃的另类处理
最近公司一个项目在公交站旁边弄一个 广告牌,上面是广告视频,下面是广告图片,都是无限轮播的.要求从早上6点到晚上11点不间断播放.剩余时间为关机状态. 图片部分还好说,就是viewpager弄一个无限 ...
- .Net基础篇_学习笔记_第五天_流程控制while循环003
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...
- VUE从入门到放弃(项目全流程)————VUE
VUE从入门到放弃(第一天)--整体流程 先想想一个项目,vue项目是从什么到什么,然后再什么的?那是什么呢? 搭建 ( vue-cli) 代码内容 运行 封装 成品 一.搭建(脚手架vue-cli) ...