好多人说ionic好用，一直要推荐我用，我就不信了，来安装玩一下试试效果。实践出真知！安装过程各种坑，工具太多了，太麻烦了，差点放弃（还好坚持下来呢）。...1.安装node 许多前端工具的安装都依赖于node的包管理器npm，Node官网： https://nodejs.org/ 安装完成后在cmd中输入 npm -v 回车。...3.安装安卓的SDK 打开Android Studio，File --> Settings --> 搜索sdk,找到对应的sdk进行安装即可。 需要在Path环境变量中添加两个值。...(y/N) 意思是是否要把 iOS 和Android集成到刚刚用Cordova 创建的app中 ，我这里选择y 表示确定。然后就会自动安装缺失的或者更新某些工具版本。 然后就会看到一个提示?...后面还有步骤，太麻烦了，我这里就不列举了，我已经放弃使用ionic创建安卓项目了，可以直接看下文。 6.
最近几年，针对我的社交项目，我尝试使用Hybrid框架和AngularJS以及Ionic，Cordova一起构建一个示例……但一切并不像我想象得那样容易。...Xamarin使得你可以使用C#创建原生的应用。 在文章的另一部分，我将从定义硬件和软件需求开始入手，即便是你没有任何的移动端开发经验，也能够开始了解如何开始构建一个移动应用。...如果你希望构建一个Android应用，在Windows上进行开发的话你需要Visual Studio 2017或者在Mac上进行开发的话你需要 Visual Studio for Mac版本。.../requirements/ 针对全部这两个平台的设置，我们都需要安装Visual Studio的最新版本，直至我写下这篇博文，我们能够使用的最新版本是Visual Stuido 2017（Windows...更多信息请参见： https://www.visualstudio.com/pt-br/vs/visual-studio-mac/ 使用Android的先决条件 Android版本开发的基本需求是以下组件
所谓的Anrdoid打包，就是将ionic项目打包成一个可以安装在Android系统上的apk文件，打包的时候，使用的是cordova工具，不过在此之前，需要一些准备工作：配置JDK、Android...SDk还有各个android版本包的下载，最重要的是需要成功的创建了一个Ionic项目，有关ionic项目创建的详细教程，请参考以下文章： Ionic3 Start 配置JDK 主要就是以下流程...android studio，这是一个开发工具，同时里面也自带了了一些已经下载好了的package，这种能方式能省很多麻烦，同时你也可以直接利用android studio 进行开发。...添加平台通过cordova工具添加，新版本和老版本的命令会有一些区别，以新版本为准： ionic cordova platform add android 该命令用于向当前应用添加 android...执行该命令之后，可以在应用的根目录看到一个新建的文件夹：platform 这个过程中可能会遇到一些问题，不需要轻言放弃，仔细观察错误信息 打包 同样利用cordova工具进行打包。
在开始之前我假设你已经了解了如下概念： Java JDK Apache Ant Android SDK NodeJS 以上名词这里就不赘述，如果有不清楚的可以自行查阅 安装步骤 Ionic 官方教程：...; 在这里我发现 Android SDK 安装目录中并没有platform-tools这个文件夹，运行 tools 目录下的 android.bat 文件，然后在出现的界面中勾选 Android SDK...注意：这里我下载的纯净版 SDK 之前并没有任何 Android 系统在内，所以同 Platform-tools 一样需要在这里勾选需要的版本然后安装。这里至少需要有一个系统，否则无法创建虚拟机。...nmp 安装 Ionic 和 Cordova 完成以上几步需要配置的环境就搭建完成了，接下来就只需要在控制台输入简单的几行命令就可以安装 Ionic 和 Cordova 啦。.../android/build/outputs/apk 下就会生成已签名的安装包 android-release.apk 在 windows 下 storeFile 文件路径应使用 Unix 下的目录分隔符
Please include gradle in your path, or install Android Studio 做了ionic项目，碰到了很多关于环境的坑，昨天我整理了下思路，重新安装了系统...执行npm install出的错 中途给我报了 一个错说我没有安装python 反正是有这个错，然后又安装了 python安装时没有修改安装路径，直接默认路径。...执行ionic cordova build android 出现的错误信息 然后我就下载配置了gradle的环境。...下载gradle 我下载了gradle-3.2 （3.2的版本） 下载完成后解压缩出来。 然后在环境变量里面配置了 path环境变量 D:\adt\gradle-3.2\bin ?...查找了资料，发现是安卓SDK25没有安装。然后在进入安卓sdk管理工具勾选红色的部分然后安装 ?
我将演示如何使用 OIDC 重定向、Okta 的 Auth SDK 以及基于 Cordova 内嵌浏览器的 OAuth 进行登录； 由于功能还在开发中，所以省略了用户注册。 为什么使用 Ionic？...开始使用 Ionic 为了设置 Ionic 的开发环境，需要完成以下几步： 安装 Node.js 使用 npm 安装 Ionic 和 Cordova： npm install -g cordova ionic...你可以退出之后看一下带标识的登录页。 ? 注意： 你可能注意到退出之后标签页并没有消失。我正在查找 没有正常工作 的原因。 发布到移动设备 使用 Ionic 在浏览器中开发移动应用是非常酷的事情。...Android 为了模拟或者部署到 Android 设备上，你首先要安装 Android Studio。在安装过程中，它会提示你将 Android SDK 安装到哪里。...如果你已经安装了Android Studio，请确保打开它以完成安装。 为了部署到 Android 模拟器，运行 ionic cordova emulate android。
我将演示如何使用 OIDC 重定向、Okta 的 Auth SDK 以及基于 Cordova 内嵌浏览器的 OAuth 进行登录； 由于功能还在开发中，所以省略了用户注册。 为什么使用 Ionic？...开始使用 Ionic 为了设置 Ionic 的开发环境，需要完成以下几步： 安装 Node.js 使用 npm 安装 Ionic 和 Cordova： npm install -g cordova ionic...你可以退出之后看一下带标识的登录页。 ? 注意： 你可能注意到退出之后标签页并没有消失。我正在查找 没有正常工作 的原因。 发布到移动设备 使用 Ionic 在浏览器中开发移动应用是非常酷的事情。...image.png Android 为了模拟或者部署到 Android 设备上，你首先要安装 Android Studio。在安装过程中，它会提示你将 Android SDK 安装到哪里。...如果你已经安装了Android Studio，请确保打开它以完成安装。 为了部署到 Android 模拟器，运行 ionic cordova emulate android。
转载请声明原文链接和作者信息。 ? 经常看到大家在一些技术群热火朝天的争论跨平台技术的牛逼之处，其实是毫无意义的，尺有所短寸有所长，每个技术各司其职，没有好坏之分。争论有何意义？...（2） 小程序 小程序：是一种无需下载安装即可使用的应用，只需要扫一扫或打开微信搜一下即可打开应用。2016年9月21日，微信小程序正式开启内测。...Cordova从PhoneGap中抽出的核心代码。Cordova是一个使用HTML，CSS和JS这些前端语言去构建移动应用的平台。...（4） Scade Scade：Scade是一个跨平台的，支持Android，Apple和Linux的工具。使用Swift的代码库为进行开发，可以构建和部署多个不同平台的应用。...通用平台特定的控件直接集成到Scade图形SVG渲染引擎中,Scade标准库提供了大量系统功能,操作系统特定功能作为默认包公开并易于使用，无需包装或使用外部功能接口。
运行效果 这个运行是在浏览器中查看到的效果。...还是有错误 还是有错误，在执行cordova platform add android --save时错误了， 关于cordova 的操作指令可以查看https://cordova.apache.org...image.png 尝试使用cordova安装android插件还是出错。一周了也没有解决。网上查了无数资料，尝试未能解决问题。暂且放一放。或许后面就解决了呢。...使用同事的电脑尝试，无需安装java环境和android环境这一步是能通过的。 我们来看下ionic项目文件 ?...后续 重装系统后，安装要求安装配置了java和Android sdk，Gradle不过java我装的是32位的 然后按照Cordova官网的提示安装了以下几个包 ?
–g cordova 注意：由于有长城在下载非常慢也有可能失败，最好使用代理或V** 安装完成后就可以开始生成项目了 Android SDK 这里我推荐安装Android Studio.../index.html 安装完成后，配置一下环境变量 Java Path Android Path 启动android虚拟设备的时候需要用到 开发工具 sublime...start todoapp blank --v2 –ts 注意：还是因为有长城，速度相当的慢，请耐心一点 $Ionic serve OK 运行成功了 下一步部署到android...设备上 $ionic run android 这里有bug据说下个版本解决 我这里就不用typescript了 从新生成一个项目用JavaScript 注意:这里可能还会碰到问题...，并没有启动模拟器也没有提示android apk的编译完成 也就是说配置android SDK 的模拟器有问题，这里需要检查 已经部署到模拟器上
2、安装cordova npm install -g cordova@5.4.1 3、安装安卓平台 ionic platform add android, 会安装android 24 的平台，我是在...Ionic Lab 中安装的，是安装android 22 平台，因为我的SDK是下载的Android 5.1.1 (API22),在android SDK Manager 可以下载其它的版本 在安装的过程中可能会出现...\gradle这个目录里面，然后找到 E:\ionic\ionicdemo2\platforms\android\cordova\lib 里面的build.js 文件，改成下面的 var distributionUrl...回车 等待安装，安装时间比较长 5、ionic build android 网上看到很有可能是因为你的Gradle的工具会去下载platforms/android/cordova和CordovaLib...，我是耐心等的安装maven库，大概要一小时，有一次打包还是报错 ?
环境搭建 参考官网使用即可： 安装node，使用 Homebrew 进行安装 brew install node 安装[Weex CLI（weex-toolkit）] (https://github.com...&&chmod 777 ~/.xtoolkit 安装结束后你可以直接使用 weex 命令验证是否安装成功，它会显示 weex 命令行工具各参数： ?...观察发现，都是在weexpack里面的，而且居然写死了名字！也就是说修改配置文件，这里都不会动态变化，同时用Android Studio打开，包名也是固定死是：com.weex.app。...插入android手机或者启动AVD，并再次执行命令，此时应用顺利运行： ? image.png 当然也可以用Android Studio来打开运行也是可以的。 简单比较 1....只不过若都以cordova方式来开发的话，weex自身html方面的优化应该没有ionic那么好。 因为如其名，匆忙一瞥，对weex了解不深，可能有写错的，欢迎指正。
+ 和 Android 4.1+版本，且有计划会支持Windows设备。...对其他较老的设备无版本支持计划。 系统必备 本教程会使用到下面的环境，请预先准备。...Git Node.js Bower Apache Cordova 在本教程中，我们使用Chrome用于开发、调试，同时，你也可以在Android和IOS设备上用其他浏览器来调试。...配置系统环境，请参考Cordova Platform Guide，按照向导即可完成。 快速入门 基于上面的系统环境安装的NodeJs，我们先安装Ionic CLI。...在www目录下，创建一个index.html，用您习惯使用的IDE(Visual Studio、Web Storm)进行编辑，添加jQuery、Wijmo引用： <!
Ionic 的生态系统基于Angular 和Cordova，前者是Web 应用框架，后者是构建和打包原生应用的工具。 下图展示了整个技术栈的概况 ? 技术栈的起点是用户在设备上打开应用。...iOS 和Android 都提供了一系列预先定义好的API，可帮助开发者在可控的范围内使用平台特性。有许多官方或者非官方出品的工具可以辅助开发原生应用。...可维护性—移动端网站很容易更新和维护，没有任何审核流程，也不需要更新设备上的程序。 免安装—网站在互联网中，不需要安装到移动设备中。 跨平台—所有移动设备都有浏览器，它们都可以访问你的应用。...有很多工具可以实现WebView 和原生平台之间的通信，从而让Hybrid 应用成为可能。发布这些工具的并不是iOS 或者Android 官方平台，而是第三方，比如Apache Cordova。...通过插件访问原生功能—你需要的原生API 现在可能还没有插件实现，可能需要一些额外的开发工作来进行桥接。 没有原生用户界面控件—如果没有Ionic 这样的工具，开发者需要创建所有的用户界面元素。
一、Cordova的基础点 在混合式应用中，我们通过现有的Cordova插件，可以轻松的在 H5 上调用手机native的功能。...现有的Cordova插件能满足平时大部分的开发需求，然而，有时候找不到合适的插件、或对找到的插件有不满意的地方，那就要动手去做或改写一个插件，这时候就要了解一些Cordova插件的相关知识。...四、安装已开发完成的插件 如果没有现成的项目，可以创建一个新的cordova项目来测试： cordova create hello com.example.hello HelloWorld 然后像平常添加插件一样...： ionic cordova plugin add /Users/cordova/MyToast 在ionic2或以上使用时，打开任意一个ts文件，在头部声明如下： declare let cordova...ionic cordova plugin remove XXXXX(你的plugin_id) 查看已安装插件 ionic cordova plugin list
简单说，iOS 的原生技术栈就是使用 Object-C 语言或 Swift 语言，在 Xcode 开发环境中编程。...安卓的原生技术栈，则是使用 Java 语言或 Kotlin 语言，开发环境是 Android Studio。 下面就来看看，它们怎么加载网页。 3.1 Xcode iOS 开发需要安装 Xcode。...3.2 Android Studio 安卓的官方开发工具是 Android Studio，可以去官网下载。 ? 安装完成后，打开新建一个项目，类型是"Empty Activity"。 ? ?...运行代码之前，Android Studio 要求必须连接真机，或安装安卓模拟器。完成以后后，在工具栏上点击运行按钮，就可以运行代码查看效果了。 ? ?...它的使用需要 Visual Studio，这里就不举例了。根据官方文档，WebView 的用法如下。 ?
混合手机app开发之Ionic篇第一章 第一节：环境搭建 本次使用的是Ionic3，之前本想用最新的ionic5 使用ionic build后发现，我使用的X5内核不能正常浏览，使用ionic3没有任何问题...5、nfc读读取卡标签（Android串口开发）。 ionic就不多啰嗦了百度一下你就知道，首先搭建开发环境，有不明白的请自行百度。...1、下载node.js 百度搜索node.js官网，下载最新的node.js,傻瓜式安装即可，安装完成之后，使用命令（windows+R）CMD执行node -v和npm -v命令，返回版本号表示已安装成功...2、安装Ionic 上面步骤成功之后执行npm install -g cordova ionic命令安装cordova和ionic，安装完执行ionic -v，返回版本号表示已安装成功。...需要declarations和entryComponents中引入组件 3.如果跳转，在跳转的ts中引入组件。
不过在此之前，必须要将ionic项目成功打包成Android应用，有关 ionic打包成Android应用的具体教程，请参考以下文章： Ionic3 Android打包 模拟器调试 模拟器调试也就是启动...在使用android模拟器之前，需要先下载对应体系的模拟器。 在命令行下运行：android sdk 出现如下界面。找到你需要的android版本，比如我的是android6。...但是，要使用X86模拟器的话，需要安装 英特尔硬件加速执行管理器。安装这个加速器的方法可能由两种。不过可能我系统比较新，第一种已经不支持了。...可以通过 cordova emulate android 调出模拟器。不过在此之前，我们需要先通过 avd 工具创建一个模拟器。...如果这时候还是无法看到你的设备，就把数据线断开再重新连接一次，然后再执行 cordova run android 。这样一般就可以了，我百试百灵。
Ionic 在发布了1.0版本以后，被越来越多的关注和支持，社区也十分的活跃。本文将继续上篇，使用Ionic 框架来开发应用。 1....首先安装NodeJs：https://nodejs.org/ 在NodeJs 网站上找到自己平台的安装包，执行安装即可。 2....npm install -g cordova ionic 在Mac下安装的时候，可能会出现没有权限的问题。...ionic start DeliveryApp blank ? 4. 运行 ionic serve 看一下在网页中的模拟效果。 ionic serve ? 5....给这个应用添加发布平台，这里添加了 android 平台和 ios 平台。 cordova platform add android ? cordova emulate android ?
-v打印版本，检查npm是否安装成功，同样的，后续说明的nrm -v，ionic -v，cordova -v也是用于检查是否安装成功。...，连接情况也不太保障； 2、使用cnpm，淘宝把npmjs.org在国内做了个镜像，封装了新的cli，其用法跟npm用法完全一致，只是在执行命令时将npm改为cnpm。...两者的版本并不是一致，有时候ionic-angular更新了多个版本，而ionic-cli不需要更新，而ionic-cli一般是bug修复、提高命令执行的性能，或调整ionic项目结构时才需要更新。...七、（JDK & android SDK）／xCode——可选，前者android，后者ios 一般直接下载，也可以安装android studio来实现SDK下载管理（为了方便调试android...原生代码，建议此种方式），两者完成后配置环境变量，不过，现在新版ionic-cli使得上述方式不是必须的，在ionic执行platform添加android时，检查到环境变量没有配置，就会自动下载安装配置
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
云直播
实时音视频
