现在我们开始新建一个angular5的脚手架  。

到想要建项目的目录下。比如我的 在  D:\JsProjects

进入cmd或者powershell cd 进入该文件夹下

然后开始新建,ng new 项目名

当然第一次,会有点慢。这个过程如果出错,设置淘宝的Npm镜像。

可以了,只要不报ERR就行了,警告可以无视。

现在你可以npm start 来运行该项目了。

首先进入项目的文件夹    。

cd demo1

输入   npm start

ok,angular 应用已经开启了,运行在 http://localhost:4200 上

接下来我们来看一下他的目录吧。

只用webstorm打开该文件夹         。

你可以看到。angular-cli已经  帮我们创建了一些基本的文件。

一般来说,不需要我们主动的修改这些文件,我们只修改src文件夹下的代码就能非常好的开发一个angular应用。

将刚刚powershell关闭,否则会有端口冲突。

当然首先把这个取消掉,tslint。不太需要吧。一些代码的强制规范。我是不太喜欢的。

当然webstrom 的默认字体是非常难看的。

用这个字体吧。至少看起来比较舒服。

ok,为当前项目配置一个启动。

            

编辑配置,添加一个新的配置文件。选择npm

OK,只需要按照以下配置,Name是随便取的。Command 选择start 。

保存就够了。

  点击绿色小箭头就够了。

OK,开发前的一些配置,就差不多完了,下一节开始开发angular。

2。创建第一个angular应用,已经开发前的一些配置的更多相关文章

  1. 使用ionic与cordova(phonegap)进行轻量级app开发前的环境配置与打包安卓apk过程记录

     前言 有人说:"如果你恨一个人,就让ta去接触cordova(phonegap)",这是因为这里面的水很深,坑很多,真让人不是一般地发狂.或许有幸运的人儿基本顺顺利利就配置完环境 ...

  2. Angular CLI 创建你的第一个 Angular 示例程序

    第一步:安装 Angular CLI 你要使用 Angular CLI 来创建项目.创建应用和库代码,并执行多种开发任务,比如测试.打包和发布. 全局安装 Angular CLI. 要想使用 npm  ...

  3. Angular入门,开发环境搭建,使用Angular CLI创建你的第一个Angular项目

    前言: 最近一直在使用阿里的NG-ZORRO(Angular组件库)开发公司后端的管理系统,写了一段时间的Angular以后发现对于我们.NET后端开发而言真是非常的友善.因此这篇文章主要是对这段时间 ...

  4. Angular学习笔记—创建一个angular项目

    开始项目前,你需要先安装node和npm,然后执行npm install -g @angular/cli安装Angular CLI. 如何安装node.js和npm npm使用介绍 1.安装angul ...

  5. WCF开发实战系列一:创建第一个WCF服务

    WCF开发实战系列一:创建第一个WCF服务 (原创:灰灰虫的家http://hi.baidu.com/grayworm) 在这个实战中我们将使用DataContract,ServiceContract ...

  6. 第三章 Odoo 12 开发之创建第一个 Odoo 应用

    Odoo 开发通常都需要创建自己的插件模块.本文中我们将通过创建第一个应用来一步步学习如何在 Odoo 中开启和安装这个插件.我们将从基础的开发流学起,即创建和安装新插件,然后在开发迭代中更新代码来进 ...

  7. Angular2快速入门-1.创建第一个app

    一.环境搭建 Angular2 运行在nodejs 环境下,需要我们先创建好nodejs环境,具体操作   1.下载安装Nodejs,参考网址,https://nodejs.org/en/ 选择64位 ...

  8. 手把手教你使用Vue/React/Angular三大框架开发Pagination分页组件

    DevUI是一支兼具设计视角和工程视角的团队,服务于华为云DevCloud平台和华为内部数个中后台系统,服务于设计师和前端工程师.官方网站:devui.designNg组件库:ng-devui(欢迎S ...

  9. 用Kotlin创建第一个Android项目(KAD 01)

    原文标题:Create your first Android project using Kotlin (KAD 01) 作者:Antonio Leiva 时间:Nov 21, 2016 原文链接:h ...

随机推荐

  1. Hbase思维导图之架构

  2. 【JS】获取一个月份有多少天

    new Date(year, month, 0).getDate() 通过 Date 构造函数传入年份.月份.零,然后通过调用获取日期函数即可获取当前月份有多少天 new Date(2019, 2, ...

  3. 安装Vmware并破解

    1. 先下载Vmware安装包 链接:http://pan.baidu.com/s/1hsjCKgk 密码:c1o6 2. 解压缩 3. 运行VMware-workstation-full-10.0. ...

  4. 自定义Banner

    Spring Boot项目启动时,默认的打印样式如下 自定义 在/src/main/resources目录下新建banner.txt,在里面输入要打印的文字即可,例如: 图形制作网站:http://w ...

  5. mysql 案例 ~ mysql字符集详解

    一 谈谈mysql常见的字符集问题 二 字符集统一  1 character_set_server  2 character_set_client  3 java/php等连接字符集  4 chara ...

  6. MongpDB 学习手册 - 索引

    //查看数据库以及容量 // show dbs //查看有哪些数据表 // show collections // MongoDB 索引 // 索引通常能够极大的提高查询的效率,如果没有索引,Mong ...

  7. ASP.NET MVC - WEB API

    ASP.NET WEB API 与WEB API有关的类型 HttpMessageHandler(System.Net.Http)(消息处理器) 表示Http请求的处理程序,处理程序类似于Http管道 ...

  8. 20165325 2017-2018-2 《Java程序设计》结对编程_第一周:四则运算

    一.码云链接 项目名称FAO 码云链接 二.需求分析 实现一个命令行程序: 自动生成小学四则运算题目(加.减.乘.除) 支持整数 支持多运算符(比如生成包含100个运算符的题目) 支持真分数 统计正确 ...

  9. python中// 和/有什么区别

    python中// 和/有什么区别 通常C/C++中,"/ " 算术运算符的计算结果是根据参与运算的两边的数据决定的,比如: 6 / 3 = 2 ; 6,3都是整数,那么结果也就是 ...

  10. Linux IDR机制【转】

    转自:https://blog.csdn.net/av_geek/article/details/49640433 IDR机制在Linux内核中指的是整数ID管理机制. 实质上来讲,这就是一种将一个整 ...