Ionic 环境搭建,代理设置_移动开发_编程开发_程序员俱乐部

中国优秀的程序员网站程序员频道CXYCLUB技术地图
热搜:
更多>>
 
您所在的位置: 程序员俱乐部 > 编程开发 > 移动开发 > Ionic 环境搭建,代理设置

Ionic 环境搭建,代理设置

 2017/8/11 13:31:19  shenyinabcd  程序员俱乐部  我要评论(0)
  • 摘要:一、介绍Ionic是一个CSS+JS界面框架,Ionic使得开发者能够使用HTML编写出手机App界面,外观和原生手机App非常相似。IonicCLI使得开发者能够将Ionic开发的界面打包成IOS的.ipa包,或者Android的.apk包。二、搭建Ionic环境1.首先安装node.js和npma.如果你是在Windows平台下,请下载node.js的安装包并安装,安装包里面自带npm。地址是:https://nodejs.org/en/b.如果你是用的是Mac平台
  • 标签:环境搭建 代理

一、介绍

  Ionic 是一个 CSS+JS 界面框架,Ionic 使得开发者能够使用 HTML 编写出手机 App 界面,外观和原生手机 App 非常相似。

  Ionic CLI 使得开发者能够将 Ionic 开发的界面打包成 IOS 的 .ipa 包,或者 Android 的 .apk 包。

  

 

二、搭建 Ionic 环境

  1. 首先安装 node.js 和 npm

    a. 如果你是在 Windows 平台下,请下载 node.js 的安装包并安装,安装包里面自带 npm。地址是:https://nodejs.org/en/

      

    b.如果你是用的是 Mac 平台,请先安装 Homebrew。地址是:https://brew.sh/

      

      然后使用 Homebrew 安装 node:

class="brush:bash;gutter:true;">brew install node

      一个命令, node 和 npm 都会安装好。

      安装完毕后,可以使用 node -v 和 npm -v 来查看是否安装成功。

 

  2. 通过 npm 安装 ionic

    (如果电脑是通过代理上网的,需要先设置一下 npm 的代理,请看第三节)

    在命令行下,输入:

npm install -g cordova ionic

    会同时安装好 cordova 和 ionic. 可以通过 ionic -v 来查看 ionic 是否安装正确

 

 

三、设置代理(可选)

  如果是通过代理方式上网的(比如在某个企业内部),请进行下面的代理设置。否则不需要设置代理。

  1. 设置 npm 代理

    在命令行运行以下命令,其中 <ip_addr> 和 <port> 换成自己代理服务器的地址和端口:

npm config set proxy=http://<ip_addr>:<port>
npm config set https_proxy=https://<ip_addr>:<port>

  2. 安装 Ionic 代理插件

    最新版的 ionic 不包含 proxy 插件,所以要单独安装。在命令行输入以下命令:

npm install -g @ionic/cli-plugin-proxy

  3. 设置 Ionic 代理

    设置下面三个环境变量,其中 <ip_addr> 和 <port> 换成自己代理服务器的地址和端口:

HTTP_PROXY = http://<ip_addr>:<port> 
HTTPS_PROXY = https://<ip_addr>:<port> 
IONIC_HTTP_PROXY = http://<ip_addr>:<port> 

 

 

四、创建 Demo 程序

  在命令行下输入:

ionic start myApp tabs
cd MyApp
ionic serve

  会打开浏览器。我使用的是 Chrome,按 "F12" 进入开发者模式,然后点击切换手机按钮,换成手机模式:

  

  恭喜!Ionic 环境搭建完成,可以开发了。

 

 

Reference:

1. mac 安装 node 和 npm:http://blog.teamtreehouse.com/install-node-js-npm-mac

2. Ionic Getting Started : http://ionicframework.com/getting-started/

3. Ionic 代理设置:https://github.com/ionic-team/ionic-cli#using-a-proxy

  

  

发表评论
用户名: 匿名