zoukankan      html  css  js  c++  java
  • angular2开发01

    angular2开发01

    1 angular2 开发准备

    开发环境是linux mint 17.3 64位

    1.1 安装node

    node在linux的部署主要有三种方式,第一种方式,使用apt-get install nodejs安装,这种方式有缺点,安装后的版本太低(0.10),官网都已经到4.5了; 第二种就是自己下载源码,手动编译二进制,这种方式要求有点高,属于高级用 户方式;第三种方法 直接下载二进制文件解压,只需进行简单配置即可;我采取 第三种方式安装。

    1. node官网 下载最新版,v6.6.0 Currnet,下载后将安装包移动到要安装 到的文件夹下,我放在了/home/flysic/soft/ 下面,依次执行如下命令:
    cd ~
    cd soft
    tar -vxf node-v6.6.0-linux-x64.tar.xz
    
    1. 进入解压后的目录bin目录下,执行ls会看到两个文件node,npm. 然后执 行./node -v ,如果显示出版本号v6.6.0,说明我们下载的程序包是没有问题。
    cd cd node-v6.6.0-linux-x64/bin/
    ./node -v
    v6.6.0
    
    1. 注意node安装包里带了一个npm程序,这个程序的版本是2.x,虽然可以用, 但是要开发angular2版本就嫌低了,因此需要单独安装最新版的npm
    2. 目前node只能在 /home/flysic/soft/node-v6.6.0-linux-x64/bin这个目录 下访问,因此需要将这个目录添加到PATH路径,或使用软链接;一般在 windowws下使用PATH路径方式,linux使用软链接方式
    sudo ln -s /home/flysic/soft/node-v6.6.0-linux-x64/bin/node /usr/local/bin/node
    

    1.2 安装npm

    查看 npm官网 上没有看到下载,倒是在 npm的github 上看到安装方式,

    Fancy Install (Unix)
    There's a pretty robust install script at https://www.npmjs.com/install.sh. You can download that and run it.
    Here's an example using curl:
    curl -L https://www.npmjs.com/install.sh | sh
    

    使用上面的方式安装,出现一下信息,说明按照成功,这时在 soft/node-v6.6.0-linux-x64/下的bin目录,应能看到新的npm程序,查看版本 (npm -v),应是3.10.8。

      ├── unpipe@1.0.0
      ├─┬ validate-npm-package-license@3.0.1
      │ ├─┬ spdx-correct@1.0.2
      │ │ └── spdx-license-ids@1.2.0
      │ └─┬ spdx-expression-parse@1.0.2
      │   ├── spdx-exceptions@1.0.4
      │   └── spdx-license-ids@1.2.0
      ├─┬ validate-npm-package-name@2.2.2
      │ └── builtins@0.0.7
      ├─┬ which@1.2.11
      │ └── isexe@1.1.2
      ├── wrappy@1.0.2
      └── write-file-atomic@1.2.0
    It worked
    

    目前npm只能在 /home/flysic/soft/node-v6.6.0-linux-x64/bin这个目录下访 问,因此需要将这个目录添加到PATH路径,或使用软链接;一般在windowws下使 用PATH路径方式,linux使用软链接方式

    sudo ln -s /home/flysic/soft/node-v6.6.0-linux-x64/bin/npm /usr/local/bin/npm
    

    1.3 运行qickStart

    • 克隆angular2.0的qickStart程序
    git clone https://github.com/angular/quickstart angular2_l
    cd angular2_l
    
    • 安装依赖库,程序依赖库配置在package.json文件,执行npm install,等待 安装完成,当显示出现信息时,说明执行成功
    > angular-quickstart@1.0.0 postinstall /home/flysic/workapace/angular2_l
    > typings install
    
    typings WARN deprecated 2016-09-25: "registry:dt/node#6.0.0+20160831021119" is deprecated (updated, replaced or removed)
    typings WARN deprecated 2016-09-14: "registry:dt/core-js#0.0.0+20160725163759" is deprecated (updated, replaced or removed)
    typings WARN deprecated 2016-09-15: "registry:dt/angular-protractor#1.5.0+20160425143459" is deprecated (updated, replaced or removed)
    typings WARN deprecated 2016-09-15: "registry:dt/selenium-webdriver#2.44.0+20160317120654" is deprecated (updated, replaced or removed)
    
    ├── angular-protractor (global)
    ├── core-js (global)
    ├── jasmine (global)
    ├── node (global)
    └── selenium-webdriver (global)
    
    • 运行程序,执行npm start,会出现以下信息,同时打开浏览器,显示""My First Angular App"
    > angular-quickstart@1.0.0 start /home/flysic/workapace/angular2_l
    > tsc && concurrently "tsc -w" "lite-server"
    
    [1] Did not detect a `bs-config.json` or `bs-config.js` override file. Using lite-server defaults...
    [1] ** browser-sync config **
    [1] { injectChanges: false,
    [1]   files: [ './**/*.{html,htm,css,js}' ],
    [1]   watchOptions: { ignored: 'node_modules' },
    [1]   server: { baseDir: './', middleware: [ [Function], [Function] ] } }
    [1] [BS] Access URLs:
    [1]  --------------------------------------
    [1]        Local: http://localhost:3000
    [1]     External: http://192.168.1.115:3000
    [1]  --------------------------------------
    [1]           UI: http://localhost:3001
    [1]  UI External: http://192.168.1.115:3001
    [1]  --------------------------------------
    [1] [BS] Serving files from: ./
    [1] [BS] Watching files...
    [1] [BS] File changed: app/app.component.js
    [1] [BS] File changed: app/app.component.spec.js
    [1] [BS] File changed: app/app.module.js
    [1] [BS] File changed: app/main.js
    [1] [BS] File changed: e2e/app.e2e-spec.js
    [0] 09:09:21 - Compilation complete. Watching for file changes.
    

    o_angular2.png

    Author: flysic

    Created: 2016-09-26 一 09:29

    Emacs 25.1.50.2 (Org mode 8.2.10)

     

  • 相关阅读:
    C++多态性(静多态和动多态)
    根据二叉树的后序遍历以及中序遍历还原二叉树
    哈希表
    *********** 复习算法复杂度,基础 ************
    C++虚函数表解析
    为什么需要auto_ptr_ref
    python未修辞的计时器
    python删除一个非空文件夹竟然如此简单
    python模拟163登陆获取邮件列表
    wxpython制作eml文件阅读器
  • 原文地址:https://www.cnblogs.com/machine/p/5904426.html
Copyright © 2011-2022 走看看