美文网首页Web前端之路让前端飞
Angular2.0快速上手(开发准备一)

Angular2.0快速上手(开发准备一)

作者: 葉糖糖 | 来源:发表于2017-05-09 16:33 被阅读332次

    开发angular是一件愉快的事情,虽然总会有人诟病,但那又如何。你玩的开心就行了,就像小婴儿抓到一张也能玩的很嗨。又何必去计较太多。

    一、安装Node.js,编码半辈子

    1、不要问我Node.js是什么,其次我也不想讲。毕竟这集它不是主角,Angular才是带着主角光环出场的家伙。首先下载Node.js的安装资源https://nodejs.org/en/,输入链接会打开如下页面:

    根据自己的电脑选择下载

    个人用的是win10的64位系统,所以就直接使用Windows(64)的资源。

    2、下载资源,客官可以使用V6版本的,也可以使用V7版本,你开心就好!

    演示使用V7版本

    3、双击资源准备安装Node.js;

    点击Next

    4、选择同意安装,并点击下一步;


    5、选择安装路径,默认安装C盘,这里演示调整为E盘;


    可根据实际情况调整

    6、选择安装组件,默认即可,直接点击下一步;

    7、点击安装;

    8、默默等待;

    9、安装完毕,可以浪了。


    完成安装

    二、检查佩剑,出门闯江湖

    1、检查Node.js是否安装成功,打开命令行工具输入node -v,出现版本信息则说明安装成功;

    2、通过npm install -g typescript安装ts;

    安装ts

    3、安装angular/cli工具;

    注意:由于angular-cli已经改名成了angular/cli,所以安装的时候请使用以下命令:npm install -g @angular/cli。如果安装有问题可以使用cnpm,在命令行中执行如下的命令:
    npm install -g cnpm --registry=https://registry.npm.taobao.org,尔后继续安装cli脚手架工具,cnpm install -g @angular/cli

    4、检查angular/cli安装情况;

    输入ng --version,出现如下信息说明安装正确。

    三、折腾半天,才迈出一步

    年轻人总想搞点大新闻,但是各种环境的搭建又总会去花去大部分的时间。真坑!下面我们将一起创建angular2的项目,并运行项目。

    1、创建hello-world项目

    在命令行工具中输入ng new hello-world,然后喝杯咖啡慢慢等待;

    创建第一个项目

    2、运行项目,大功告成

    在命令行输入ng serve指令,启动项目;

    3、查看效果

    打开浏览器,输入http://localhost:4200/,至此我们已经完成了入门篇。

    ** PS:**
    Node.js是什么?
    Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。
    Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型,使其轻量又高效。
    Node.js 的包管理器 npm,是全球最大的开源库生态系统。

    相关文章

      网友评论

        本文标题:Angular2.0快速上手(开发准备一)

        本文链接:https://www.haomeiwen.com/subject/irgbtxtx.html