3.安装安卓的SDK 打开Android Studio,File --> Settings --> 搜索sdk,找到对应的sdk进行安装即可。 需要在Path环境变量中添加两个值。...分别是 Android SDK中tools目录的路径和platform-tools的路径。...注意AppData是隐藏文件,需要在文件夹选项里面把隐藏文件显示才可以看到(具体的怎么显示隐藏文件夹百度)。 本地安装路径如图所示: ?...(y/N) 意思是是否要把 iOS 和Android集成到刚刚用Cordova 创建的app中 ,我这里选择y 表示确定。然后就会自动安装缺失的或者更新某些工具版本。 然后就会看到一个提示?...2.执行`cordova build android`命令, 编译安卓项目 3.执行`cordova run android`命令,就会自动打开模拟器,在模拟器运行安卓项目了,如果执行`cordova
,然后将改文件夹内的bin文件夹路径添加至系统 Path 环境变量中,如存放在 C 盘 Program Files 目录下则 Path 中添加如下值 C:\Program Files\apache-ant...下载完成并安装然后向系统Path环境变量中添加两个值。分别是 Android SDK 中 tools 目录的路径和 platform-tools 的路径。...; 在这里我发现 Android SDK 安装目录中并没有platform-tools这个文件夹,运行 tools 目录下的 android.bat 文件,然后在出现的界面中勾选 Android SDK...nmp 安装 Ionic 和 Cordova 完成以上几步需要配置的环境就搭建完成了,接下来就只需要在控制台输入简单的几行命令就可以安装 Ionic 和 Cordova 啦。...进入 cmd 窗口,输入如下指令: npm install -g cordova ionic 完成以上所有步骤,就可以开始利用 Ionic 快速开发 Android APP 啦 创建并运行 ionic
Git Node.js Bower Apache Cordova 在本教程中,我们使用Chrome用于开发、调试,同时,你也可以在Android和IOS设备上用其他浏览器来调试。...先在工程的www/lib 文件夹下,创建一个Wijmo文件夹,并拷贝Wijmo源码下Dist的3个文件夹controls、interop、styles到新创建的Wijmo文件夹下。...工程文件夹中的www/lib目录,包含了该app所要依赖的库文件。 Wijmo 5下载后的源码路径概图: ? Iconic的目录浏览截图: ?...使用Wijmo 5 下面给Index.HTML文件中添加Wijmo 5控件,先需要在www/js/app.js文件中添加Wijmo的模块依赖——‘wj’。...总结 本文,我们创建了Ionic工程并添加Wijmo 5的InputNumber控件,即完成了一个Hello World! 工程压缩包下载地址
今天在用ionic2 的ionic resources生成新的icon和splash,生成后安装,应用图标和启动画面依然没变化。。。...不知道大家有没有被坑过,今天被坑了一下午,终于找到了办法: 解决方法 第一次使用ionic resources后根文件夹下会生成一个res文件夹,比如你的项目文件夹名是demo,那么就是demo/res...将res中的所有文件夹复制到demo\platforms\android\res下,res里面的同名文件夹覆盖(注意:保留该文件夹下原本的values文件夹和xml文件夹)。...再ionic run android --prod试试是不是图标和启动画面换成你自己的了?...platform rm android ionic platform add android 最后查看platform/android/res是否是期望的图标和启动画面或者build一个.apk在手机上看
/www => 浏览器运行调试时自动生成 config.xml => 配置文件 ionic.config.json => 上传到 ionic.io 会被使用 .tsconfig.json & tslint.json...常用命令 打印出Ionic运行环境信息 ionic info 更新Ionic到最新版本 npm install -g ionic@latest 生成新的page、provider等 ionic generate...[] [] []: e.g. component, directive, page, pipe, provider, tabs 在浏览器中运行调试,可打开iOS、...Android、Windows3个界面 ionic serve --lab 生成一个平台图标、启动画面 ionic cordova resources ios ionic cordova resources...cordova platform add ios ionic cordova platform remove ios ionic cordova platform update ios 编译一个平台并压缩
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 ?...cordova platform add ios ? ionic emulate ios ? 到这里 ionic 就搭建完成了。...WebStorm 开发环境 WebStorm下载地址:https://www.jetbrains.com/webstorm/ 下载并安装 WebStorm 安装完成后,使用 WebStorm 打开文件夹
ionic3一个完整项目,一般会有以下文件夹: ?...,从而在app中实现本地浏览网页的效果,其中页面和脚本等因为是本地的就不需要网上加载,在数据加载过程中就已经可以看到页面,等数据加载完成自动局部刷新页面即可,这就是ionic的运行机理,也是混合式应用的其中一种常见套路...:android、ios等平台图标、启动屏资源,在此目录下的资源通过下述命令会把资源按分辨率生成到原生项目目录中,省却自己逐个调整分辨率及拷贝的繁琐工作: ionic cordova resources...上述说的是ionic3的开发结构及其理解,现在要说的是最重要的文件夹src——angular2及以上的开发结构理解,主要为八项: app:入口文件夹; app -app.component.ts:入口页的业务逻辑...另外它们的名字也是可变的,只是基于约定大于配置的概念,而且利用ionic-cli命令行生成文件,如ionic g pipe date会生成到上述默认文件夹名称中,所以建议保持一致。
其目的是好的,只是封装过度,安装下载完的依赖包文件格式和npm的不一样,用了@和链接文件夹关联文件等,会常常导致有权限和关联包下载不全问题。...ionic-cli,是为了便于我们开发编译部署ionic项目的命令行,而ionic-angular其实才是我们常说的ionic框架,每次修复bug、更新功能指的就是它,在package.json里可以查看版本和相关依赖...两者的版本并不是一致,有时候ionic-angular更新了多个版本,而ionic-cli不需要更新,而ionic-cli一般是bug修复、提高命令执行的性能,或调整ionic项目结构时才需要更新。...注意:现在ionic-cli涉及原生相关的命令都会带上cordova,如下面命令 ionic cordova build android 但是有人会省掉ionic,变成这样:...cordova build的,是把www目录打包为原生应用,而ionic cordova build,是先执行基于ionic配置的一系列编译压缩打包命令把src源码生成www目录,再执行cordova
第二节:创建项目 1、创建项目 我想在E盘的ionic文件夹下创建一个项目使用命令执行:e:,然后:cdionic,进入执行:ionic start 项目名称 --type=ionic-angular...创建之后可以使用ionic serve命令查看效果,使用ionic build 会生成www目录,然后我们www的目录下文件放到服务器上的IIS就可以使用手机访问。...需要declarations和entryComponents中引入组件 3.如果跳转,在跳转的ts中引入组件。...新建项目:ionic start 项目名称 --type=ionic-angular 运行项目:ionic serve 发布:ionic build Android打包 ionic cordova platform...add android cordova build android 常用插件: npm install ts-md5 --save npm install @angular/http 1.npm安装
这里只说明androd和ios的情况。 1、启动前黑白屏 启动前黑白屏问题,仅存在于android,是android应用的通病,ionic表示这锅它不背。...然后安装该插件: ionic cordova plugin add 本插件本地或远程路径 验证一下,会发现在platform目录android里的res/values里会多出styles.xml文件。...4)应用项目的config.xml文件添加下面一句,指定使用的主题(2选1),这样在cordova build时,cordova-custom-config插件会执行并修改这句里的文件参数。...我们可以验证一下,执行命令运行看效果: ionic run android 2、启动后黑白屏 ionic启动页使用了cordova-plugin-splashscreen这个插件,插件配置在应用的config.xml...; SplashScreen——它是 platform / android / res / drawable - 文件夹中的图像的名称。
测试结果 文本提示 找出文件夹(及其子文件夹)中的文件并复制到目标文件夹中 1.问题引出 下载了整个2018年和2019年上半年的经济学人,不过是根据发刊日期建立了多个文件夹,我想复制出里面所有的*.epub...而且为了便于按照名字排序,最后复制后的名字做了处理,只保留了文件名中的数字(经济学人发布的年份,因为不是一个人发布的名字多少不统一。...程序源码 # UTF-8 # 整理文件 # 将指定目录下的对应格式的文件(eg.epub)复制到指定的目录中 # ------------------------------------ import...os import shutil #import copy def list_folders_files(path): """ 返回 "文件夹" 和 "文件" 名字 :param...path: "文件夹"和"文件"所在的路径 :return: (list_folders, list_files) :list_folders: 文件夹
FileTransfer是常用的Codrodva插件之一,在过去的几篇文章中都能看到它的身影: Cordova插件使用——Office文档在线预览那些事 【技巧】ionic3视频上传 【技巧】Ionic3...,但实际应用到的事件就几个,我们运行一下项目可以看到chrome中打印出来的log: ?...尝试把Blob数据保存到手机上 借助file插件用于保存文件: ionic cordova plugin add cordova-plugin-file npm install --save @ionic-native.../file 借助file-opener插件用于打开文件: ionic cordova plugin add cordova-plugin-file-opener2 npm install --save...: ionic cordova run android --device 可以发现能正常保存并安装apk,动态图就不发了,自行尝试。
运行环境 ant :Ant是Java的生成工具,用来编译、生成;跨平台, Ant的主要目的就是把你想做的事情自动化,不用你手动一步一步做,因为里面内置了javac、java、创建目录、复制文件等 功能...android SDK : Android 专属的软件开发工具包 nodejs :是一个基于 Chrome V8 引擎的 JavaScirpt 运行环境 ionic和cordova :ionic 是一个强大的...path 测试 :cmd命令框中 输入ant -v 出现版本即成功 android sdk : https://www.androiddevtools.cn/ 博主装的是解压版。...下载sdk 下载tools(我是下载最新的) tools存放位置 将下载好的tools文件解压到sdk路径下的platforms文件夹下 双击打开sdk文件夹下的SDK manager.exe...待更新。。
在项目文件夹下执行命令 ionic cordova platform add android 结果如下 ?...打开android studio -> Configure->SDK Manager 安装target的android版本 26 ? ?...继续在项目目录下执行打包命令 ionic cordova build android 如果build过程中出错 可以检测gradle版本 gradle -v 如果版本过低 ,比如低于4.10 可以升级版本...brew upgrade gradle 升级完 可以把android包删除 重新build ionic cordova platform rm android ionic cordova platform...add android ionic cordova build android
所谓的Anrdoid打包,就是将ionic项目打包成一个可以安装在Android系统上的apk文件,打包的时候,使用的是cordova工具,不过在此之前,需要一些准备工作:配置JDK、Android...添加平台通过cordova工具添加,新版本和老版本的命令会有一些区别,以新版本为准: ionic cordova platform add android 该命令用于向当前应用添加 android...执行该命令之后,可以在应用的根目录看到一个新建的文件夹:platform 这个过程中可能会遇到一些问题,不需要轻言放弃,仔细观察错误信息 打包 同样利用cordova工具进行打包。...进入目录,查看该文件。 image.png 把这个apk文件放到android上运行,发现看可以运行成功。...当然,也可以直接调出模拟器进行测试,或者是直接用usb连接手机真机上运行。有关于Android 模拟器调试和真机调试的具体教程,请参考以下文章: Ionic3 Android 调试
不定时更新,不用 Ionic 了就不更新。。。...---- Q: gitignore 默认排除了 plugins 文件夹,团队其他人 clone 了项目后缺少插件,一个一个装太麻烦。...A: Ionic 的 ngCordova 项目为70多个流行的 Cordova 插件提供了 AngularJS 包装,足以应付绝大多数需求。...中调用其他应用打开 applicationDirectory 下的文件时提示路径不存在, iOS 可以。...A: 两个系统策略不一样, Android 中有这个需求简单的办法是参考该页中的 Android 文件系统布局,把文件从 Private 目录复制到 Public 目录下再做操作。
在 Okta 中创建 OpenID Connect 应用 OpenID Connect (OIDC) 基于 OAuth 2.0 协议。它允许客户端验证用户的身份并获得他们的基本配置文件信息。...确保打开 Xcode 完成安装 ,然后运行 ionic cordova emulate ios 在模拟器中打开应用。 可能会提示你安装 @ionic/cli-plugin-cordova 插件。...如果你已经安装了Android Studio,请确保打开它以完成安装。 为了部署到 Android 模拟器,运行 ionic cordova emulate android。...执行完这些步骤之后,你可以运行 ionic cordova emulate android 查看运行在 AVD 中的 app。...这意味着你可以将 Ionic app 部署成 web app (不是移动端 app) ,它可以在离线的 支持 service workers 的浏览器 中运行。
PS:很多时候一些朋友也会说到phoneGap,其实phoneGap就是指cordova 其实cordova与Hybrid是一致的,只不过Hybrid中的IOS和Andriod Webview容器是我们...更多的学习教程:http://www.runoob.com/ionic/ionic-tutorial.html 简单实践 安装Ionic 我们去git上下载源文件(release中):https://github.com...我们在目录下新建一个demo文件夹,新增index.html: 1 <!...tabs 这里需要安装Andriod开发环境,不然的话,下面几个命令会报错,如果有Andriod环境的话,就能成功运行了: $ cd myApp $ ionic platform add android...$ ionic build android $ ionic emulate android 如果正常的话,技能弹出模拟器: ?
的位置,里面有tools的那个文件夹) (3)在系统变量path中添加 ;E:\android-sdk-windows\tools;E:\android-sdk-windows\platform-tools...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
我们尝试vscode打开~/.xtoolkit目录,以关键字playground.apk搜索其下的node_modules文件夹,搜索结果如图: ? image.png What?...也就是说修改配置文件,这里都不会动态变化,同时用Android Studio打开,包名也是固定死是:com.weex.app。 我猜这是weexpack的bug吧?应该不会一直存在。...插入android手机或者启动AVD,并再次执行命令,此时应用顺利运行: ? image.png 当然也可以用Android Studio来打开运行也是可以的。 简单比较 1....原生支持 可能刚接触不深,weex不建议但可以支持cordova,而且可以较方便集成原生第三方插件。反之,ionic只能支持cordova。...只不过若都以cordova方式来开发的话,weex自身html方面的优化应该没有ionic那么好。 因为如其名,匆忙一瞥,对weex了解不深,可能有写错的,欢迎指正。
领取专属 10元无门槛券
手把手带您无忧上云