1.安装java JDK 2.安装nodejs 3.安装最新版ionic 指令:npm install ionic@latest 4.安装cordova 指令:npm install -g cordova@6.5 5.安装androidSDK 6. 安装cnpm(主要是node自带的npm安装东西有些需要FQ才能下载),指令:npm install -g cnpm --registry=https://registry.npm.taobao.org 使用淘宝镜像,用cnpm代替npm安装 7.最…

1.安装: cnpm install -g cordova ionic ionic start name cd name cnpm install   2.环境配置: http://www.cnblogs.com/changyaoself/p/6544082.html  这里是具体配置. 测试环境: cordova platform list    如下才可以: 3.添加android平台 终端项目目录下输入命令:cordova platform add android 4.cordova编译应…

下载 android开发者官网下载sdk比较慢,甚至访问不了.所以建议去android中文网下载sdk,如下图找到android-sdk点击链接下载就行了 下载sdk 安装 安装前先要安装java jdk 安装过程基本就是点下一步,注意系统盘c盘如果容量比较小,就不要安装到系统盘,因为后面要下载许多东西,比较大.如下图我安装到d盘 安装sdk 安装到非系统盘 配置环境变量 注意android sdk环境变量需要在path后面添加\platform-tools和\tools两条路径 把这句;%AN…

前言:jdk是 Java 语言的软件开发工具包,它包含了Java 的运行环境,Java 工具和Java 基础的类库.做java web开发,android开发,还有现在流行的混合式App开发,都需要安装jdk oracle官网下载jdk 如下4张图按步骤可以找到jdk的下载路径,也可以点这里去选择你想要的版本 Paste_Image.png Paste_Image.png Paste_Image.png Paste_Image.png 安装jdk 我的系统是windows,下面就安装window…

Installing npm packages...Error with start undefinedError Initializing app: There was an error with the spawned command: npminstallThere was an error with the spawned command: npminstallCaught exception:undefined google原因:node版本有点低,做好升级到最新版(6.0以上)---…

一.学习一样新的框架的步骤: 1.先找到人家的网站, 一个个点过来看看 2.我们前端的框架,分css与js 3.先学css 再学js 4.要学会复制黏贴代码, 实际演练代码的效果 二.ionic环境安装及ionic2安装链接 (vs2015) 1. Ionic的环境安装建立在node安装好的前提下 2. 安装JDK http://www.oracle.com/technetwork/java/javase/downloads/index.html 配置环境变量 JAVA_HOME  C:\Pro…

1. 文档概述 本文档用于说明Visual Studio 2017下使用 Ionic 2进行跨平台开发的运行环境配置. 2. 安装环境 Windows10 3. 安装 Visual Studio 2017 community 3.1 官方下载地址:https://www.visualstudio.com/downloads/ 3.2 运行安装程序,需选中使用JavaScript的移动开发,如下图所示. 3.3 进行VS2017扩展Ionic2安装 3.3.1运行VS2017,点击菜单栏的 工具-…

环境配置 安装nodeJS 配置cnpm 安装ionic2 安装cordova 安装java sdk 安装android sdk(在项目最后打包时app的时候会用到,前期是在浏览器环境测试开发暂时不需要使用) 1.安装nodeJS 登录nodeJs官网(https://nodejs.org/en/download/),选择自己适用的版本,小编选用的下面这个版本Windows Installer (.msi),然后下载完成后,直接双击安装即可: 安装完成后,检测是否配置了Node.js,点击开始=…

第一次启动了react-native的示例,今天主要把其中遇到的坑与解决的办法分享给大家.如有疏漏.错误还望指正. 首先还是要从hybrid app这个概念说起(如果对于这个过程不感兴趣的同学,可以直接往下翻,从开始配置react-native看起).hybrid app就是混合应用.从我个人的理解,本以为就是在原生的app里面嵌入一些网页(webview),直到最近去体会了一把ionic,以及react-native才感受到了自己的肤浅,具体怎么肤浅了呢,一会再详细说,先来看看做一个hybri…

1.安装ionic2 $ npm install -g ionic@beta 2.创建项目 $ ionic start 项目名称 --v2 //  默认tabs的模板 $ ionic start 项目名称 tutorial --v2 //  带侧边栏的模板 $ ionic start 项目名称 --v2 --ts //  typeScript语法 默认是 ES2015也就是ES6   3.在web上启动项目 $ cd cutePuppyPics $ ionic serve 4.安装 cordov…

一:node.js.npm.cnpm.cordova环境安装 介绍下概念 node.js 非阻塞异步的Ajax 操作基础框架. npm 国外的node.js 包管理器 cnpm 国内淘宝的node.js 包管理器 cordova 和原生App接轨的插件 1.node.js 安装               Vsersion:  6.10.0/6.11.4 2.npm install -g npm 3.npm install -g cnpm --resistery.npm.taobao.org 4…

STEP 1 设置cnpm npm install -g cnpm --registry=https://registry.npm.taobao.org   一句话建立cnpm STEP 2 安装nrm cnpm install -g nrm   一句话安装nrm[先用设置cnpm,安装nrm速度飞快] STEP3 转换npm源 nrm ls   获取nrm源列表 nrm use taobao 使用taobao源 STEP 4 安装ionic npm install -g cordova ion…

开始学习ionic2,试验各种方法,感觉以下是紧跟rc版本的最佳方案 STEP1 设置cnpm npm install -g cnpm --registry=https://registry.npm.taobao.org   一句话建立cnpm STEP2 安装ionic cnpm install -g cordova ionic   全局安装ionic STEP3 创建项目 ionic start --v2 myApp tabs 注意一:有在公司用代理的,现在回到家最好要先清理下代理,否则gi…

浅谈angular2+ionic2   前言: 不要用angular的语法去写angular2,有人说二者就像Java和JavaScript的区别.   1. 项目所用:angular2+ionic2+typescript 2. 项目结构 3. Src目录是我们本地开发的目录文件,www我ionic2编译后生成的文件 4. 每个文件夹下面都有三个文件  分别是.Html..scss..ts分别代表结构文件.样式文件.功能文件.也就是HTML+css+js,ionic2+angular2所用的是t…

在群里看到有人问怎么在Ionic2中集成ECharts来显示图表.当时答应说写个blog,简单写下步骤. 在TypeScript中如果要使用第三方库,必须要有d.ts,也就是定义文件,没有这个文件的话TypeScript是认不出来的,无法编译通过.下面以百度的ECharts图表为例,演示一下使用第三方库的用法. 1.安装ECharts 首先需要使用npm安装ECharts,输入以下命令: npm install echarts --save 安装完毕后可以看到node_modules目录下多了e…

最近一直没更新博客,业余时间都在翻译Ionic2的文档.之前本来是想写一个入门,后来觉得干脆把官方文档翻译一下算了,因为官方文档就是最好的入门教程.后来越翻译越觉得这个事情确实比较费精力,不知道什么时候能完成,就先把完成的部分放出来,避免其他人再重复劳动了. 地址:https://www.gitbook.com/book/yanxiaodi/ionic2-guide/details 这个文档不是严格的翻译官方文档,开始几章是自己写的.到组件那章基本上就是翻译了,有时候也会加一点自己踩过的坑.我在…

国庆节前Ionic2发布了RC0版本,已经接近正式版了,前不久Angular2和TypeScript2也已经发布了正式版.详情请参考官方博客: http://blog.ionic.io/announcing-the-ionic-2-release-candidate/ 这次升级提高了一定的性能,引进了Angular2的一些新特性,如@NgModule.支持AoT编译(Ahead of Time)等,项目结构也发生了变化.所以需要花一点时间把beta版本的项目升级到RC0,相对于提升的性能来讲,还…

好久没写什么东西了,最近在做一个ionic2的小东西,遇到了不少问题,也记录一下,避免后来的同学走弯路. 之前写过一篇使用VS2015开发ionic1的文章,但自己还没摸清门道,本来也是感兴趣就学习了一下.后来看到TypeScript,觉得这个真不错,强类型,有点类似c#的感觉,而且如果写错了编辑器都可以感知出来,于是就开始看ionic2.ionic2是基于angular2的,语法跟以前有了很大的变化.但自己写原生app写惯了,反而觉得这种方式更方便一些.每个页面都是一个组件,组件里也可以套组件…

作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5559927.html               Ionic2提供了访问本地设备的方法,但是需要安装Cordova依赖,我们以调用摄像头拍照为例来说明: 进入项目目录:cd MyFirstApp npm install ionic-native –save 增加调用Camera的插件:ionic plugin add cordova-plugin-carmera 在Home.html中,增加如下代…

Ionic2开发环境要求: Nodejs V4.5.0 Nodejs自带 Npm V2.15.9 同上 Ionic V2.1.0 安装最新ionic即可 Angular2 V2正式版 同上 说明:以上版本号请务必对应,AngularJs每次更新都是断崖式更新,导致inoic写法多变. 开发工具: VS CODE :V1.6.1(老版本对ts支持不是很好) ionic安装步骤: 1. 安装上述版本的Node: 2. 切换源:npm set registry https://registry.npm…

Ionic2 项目中经常遇到这个问题 每次都找半天无果. 简单记录一下  粗暴的解决办法: 卸载ts并从新安装即可 //卸载typescript npm uninstall typescript //安装typescript npm install typescript 具体问题以后进行阐述,为什么tsserver文件会丢失.…

我在配置ionic2中遇到的问题,及我的解决方案. ionic start MyIonic2Project tutorial --v2 网络很坑爹,配置lantern后,也是多次尝试才下载成功. ionic resources: 生成的APP的icon及splash依旧是cordova.无论如何更改都无法生效. 好吧,这是一个cordova在android6.0.0中的一个bug. 处理方法: step1:ionic platform remove android; step2:ionic pl…

作者:Grey 原文地址:http://www.cnblogs.com/greyzeng/p/5529153.html 操作系统: Windows 10 环境配置: Node.js Java SE Development Kit Android SDK Visual Studio Emulator for Android(可采用其他模拟器,真机,或者Chrome浏览器模拟) Visual Studio Code(官方推荐三款IDE) 安装命令: npm install -g ionic@beta…

原文  https://my.oschina.net/qinphil/blog/777787 效果如下,图片来自网络 本文例子和上图稍有不同,主要功能如下: 每滑动一下展示一张全屏图片: 滑动到最后一页才出现启动按钮: 欢迎界面只在第一次安装启动时出现. 下面就让我们一步一步实现这个功能: 1.创建应用: 使用Ionic2创建应用非常简单,只需在V1的命令后跟上--v2即可,如下: ionic start ionic2-welcome --v2 2.创建Component 使用命令行创建页面或者…

什么是Ionic Ionic是一个用来开发混合手机应用的,开源的,免费的代码库.可以优化html.css和js的性能,构建高效的应用程序,而且还可以用于构建Sass和AngularJS的优化.ionic会是一个可以信赖的框架. Ionic是一个专注于用WEB开发技术,基于HTML5创建类似于手机平台原生应用的一个开发框架.使用Node.Js 进行了模块管理,绑定了AngularJS和Sass.这个框架的目的是从web的角度开发手机应用,基于PhoneGap/Codeova的编译平台,可以实现编译…

ionic2+angular2中踩的那些坑 好久没写什么东西了,最近在做一个ionic2的小东西,遇到了不少问题,也记录一下,避免后来的同学走弯路. 之前写过一篇使用VS2015开发ionic1的文章,但自己还没摸清门道,本来也是感兴趣就学习了一下.后来看到TypeScript,觉得这个真不错,强类型,有点类似c#的感觉,而且如果写错了编辑器都可以感知出来,于是就开始看ionic2.ionic2是基于angular2的,语法跟以前有了很大的变化.但自己写原生app写惯了,反而觉得这种方式更方便一…

一.环境搭建 需要安装配置以下组件,具体参考:Cordova环境搭建, 我的版本信息如下: 这里要特别注意,node版本,ionic2需要 大于v6 ,而不是0.xx版本,否则会不支持报错. 二.设置淘宝镜像 被强了你懂得,如果不设置淘宝镜像,本人亲测,一天你都搞不定 hello word. 1,registry淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org 2.使用淘宝镜像 安装 cordova cnpm…

之前讲过了如何在Ionic2中使用第三方库,因为第三方库必须针对TypeScript提供相应的声明文件——即d.ts文件,才能被TypeScript正确识别并编译.好在大多数的第三方库已经有了定义文件,可直接通过以下命令安装: npm install @types/theLibraryName --save 这样就可以解决大多数第三方库的引入问题,如上一篇博客中提到的ECharts组件. 那么如果某个第三方库没有对应的d.ts怎么办呢?除了自己手写d.ts之外,TypeScript也提供了一种比…

Ionic2混合开发,入坑系列:Ionic2中集成第三方控件Sweetalert 注:Sweetalert2已经可以直接从npm中下载安装 npm install --save sweetalert2 1.安装Typings 在命令行中输入:npm install -g typings 安装完成后,在命令行中输入:typings --version 2.在typings文件夹中创建一个*.d.ts文件,代码如下: /** * 第三方库sweetalert声明文件 * * @author dane…

1. 当你第一次产生ionic2应用程序,这是生成的项目结构 ├── ├── config.xml      这包含配置应用程序的名称,和包名,将被用于我们的应用程序安装到一个实际的设备. ├── hooks ├── ionic.config.json ionic版本信息 "name": "Ion2","app_id": "","v2": true,"typescript": true…