Ionic3开发环境搭建-VS Code

简介: 原文:Ionic3开发环境搭建-VS Code 一、Ionic3在VS Code中的开发环境搭建 1.全局安装Ionic包 npm install -g cordova ionic使用 ionic -v命令,查看是否安装成功 2.
原文: Ionic3开发环境搭建-VS Code

一、Ionic3在VS Code中的开发环境搭建

1.全局安装Ionic包

npm install -g cordova ionic
使用 ionic -v命令,查看是否安装成功


2.使用ionic start xxx 命令创建Ionic3项目

ionic start myApp tabs
注:tabs 是创建初始化项目类型,默认带有tab页模板


3.使用ionic serve 命令,运行项目

cd myApp
ionic serve
使用 ionic/cordova platforms ls ---查看支持的平台  

ionic/cordova platform add xxx ---安装支持的平台

苹果环境:

ionic platform add ios
ionic emulate ios
安卓环境:

ionic platform add android
ionic run android
4.使用VS Code 打开开项目,修改home页面

注:在VS Code中编写页面方式,和开发Angular2一样,点击保存自动刷新浏览器。

  <button ion-button color='light'>light</button>
  <button ion-button>默认按钮</button>
  <!-- 日期控件 -->
  <ion-item>
    <ion-label>Start Time</ion-label>
    <ion-datetime displayFormat="h:mm A" pickerFormat="h mm A" >
    </ion-datetime>
  </ion-item>

运行结果:



更多:

Apache Cordova开发环境搭建(二)VS Code

Ionic创建项目失败:[ERROR] Network connectivity error occurred, are you offline?

Ionic2 相关文档整理

目录
相关文章
|
JavaScript C++ Windows
Ionic2开发环境搭建-VS 2017
原文:Ionic2开发环境搭建-VS 2017 目前在VS 2017中创建Ionic2版本项目 注:在VS中开发Ionic项目,使用的Ionic(v2.x),Cordova(v6.3.1),Angular(v2.x)的版本都比较低。
1486 0
|
Web App开发 JavaScript 前端开发
Ionic 入门与实战之第二章第一节:Ionic 环境搭建之开发环境配置
原文发表于我的技术博客 本文是「Ionic 入门与实战」系列连载的第二章第一节,主要对 Ionic 的开发环境配置做了简要的介绍,本文介绍的开发环境为 Mac 系统,Windows 系统基本类似,少许差别请查阅相关文档即可。
1194 0
|
Web App开发 索引
Ionic 2 开发(一)_安装与目录结构
由于公司开始使用后ionic 进行前段开发,现在需要学习下ionic,虽然是后台开发,但是还是有必要了解下的 安装Node.js 官网:http://nodejs.cn/ 自行下载安装 安装Ionic npm install -g cordova npm install -g ionic 设置淘宝镜像 npm config set registry https://registry.
1065 0
|
Web App开发 移动开发 JavaScript
Win10 UWP开发系列:使用VS2015 Update2+ionic开发第一个Cordova App
原文:Win10 UWP开发系列:使用VS2015 Update2+ionic开发第一个Cordova App 安装VS2015 Update2的过程是非常曲折的。还好经过不懈的努力,终于折腾成功了。 如果开发Cordova项目的话,推荐大家用一下ionic这个框架,效果还不错。
1765 0
|
缓存 JavaScript Android开发
Ionic 1 & 2 开发常见问题 Q&A
原文发表于我的技术博客 本文分享了在 Ionic 1 & 2 版本开发过程中常见问题的一些 Q&A,供慕课网同学或其他朋友参考。原文发表于我的技术博客 1. 版本的问题 Ionic 2 目前属于快速迭代更新的版本,版本的更新会带来如文件结构和少许代码的变更,不过底层还是构建于 Angular 2 ...
1489 0
ionic开发之用户头像修改-图片选择与上传
用户头像修改,图片选择上传,非常常用的功能,本来打算和wap版一样,也用XMLHttpRequest和FormData来处理图片异步上传,结果在手机上测试的时候发现,onload事件没有触发,没找到原因,本来想省点事才不用插件去实现这个功能的,这下看来只能用插件了。
1652 0
|
JavaScript 前端开发 Android开发
Ionic 开发中遇到的常见问题及解决方案
Ionic 常见问题及解决方案
8298 0
|
移动开发 前端开发 JavaScript
【技术干货】前端开发之IONIC移动端开发
Ionic是一套HTML5 Hybrid Mobile应用开发框架,本文给大家介绍的是如何在MAC下搭建Ionic开发平台和开发移动端应用。快点戳进来看看吧~
5922 0
|
前端开发 JavaScript iOS开发
ionic react-native和native开发移动app到底那个好
ionic react-native和native开发移动app那个好 ? 移动端开发如何选型?这里介绍一下我眼中的ionic,react-native,native 三种移动端开发选型对比。欢迎大家补充指正一、 跨平台特性    ionic : write once, run anywhere (...
1173 0