混合式开发App步骤详解

最新推荐文章于 2025-07-04 23:20:39 发布

原创最新推荐文章于 2025-07-04 23:20:39 发布 · 3.6k 阅读

5 ·

CC 4.0 BY-SA版权

文章标签：

#java #混合开发移动应用 #h5-app

混合开发移动应用专栏收录该内容

1 篇文章

订阅专栏

本文详细介绍如何配置Ionic开发环境，包括安装Node.js、设置环境变量等步骤，并提供创建项目、添加平台、调整UI布局及调用硬件插件的具体方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

—————————— 配置开发环境 ————————————
1.先安装nodejs
2.配置环境变量（
1.ADT下SDK下的 plateform-tools,
2.ADT下SDK下的 tools
3.apache下的 ant/bin
4.JAVA的环境变量(java_home、path)
5.C:\Windows\System32 放到环境变量path里面
）
set path 打印环境变量
3.在cmd命令下载cordova npm install -g cordova
4.下载ionic npm install -g ionic（4.出错进行【5】步骤）
5.错误时进行此步骤:使用淘宝镜像cnpm
npm install -g cnpm –registry=https://registry.npm.taobao.org
cnpm install –g 模块名
———————— 创建项目从第六步开始 ———————————
6.创建项目进入项目的路径然后: ionic start m1 –skip-npm
7.cd m1
8.cnpm install –save
9.测试 ionic serve
—————————— 加平台 ————————————————
10.进入项目文件夹
11.ionic platform add android 【添加平台】
12.ionic build android 【打包android平台】
cordova build android – –ant
——————————解决andriod的tab在顶部 ————————
13.ionic run android (在js里的app.js里，配置路由前面加上)
下面这个是解决app在真机上底部栏在上面问题的代码：

$ionicConfigProvider.platform.ios.tabs.style('standard');  $ionicConfigProvider.platform.ios.tabs.position('bottom');  $ionicConfigProvider.platform.android.tabs.style('standard');  $ionicConfigProvider.platform.android.tabs.position('standard');  $ionicConfigProvider.platform.ios.navBar.alignTitle('center');  $ionicConfigProvider.platform.android.navBar.alignTitle('bottom');//默认为left  $ionicConfigProvider.platform.ios.backButton.previousTitleText('').icon('ion-ios-arrow-thin-left');    $ionicConfigProvider.platform.android.backButton.previousTitleText('').icon('ion-android-arrow-back');$ionicConfigProvider.platform.ios.views.transition('ios');  $ionicConfigProvider.platform.android.views.transition('android');

——————————调用硬件———————————————
14.在项目里的www里的js里安装cordova.js
进入项目文件（andriod开发）
npm install -g bower
bower install ngCodrova
在plugin里添加camear插件
cordova plugin add cordova-plugin-camera
网站地址:www.ngcordova.com/docs/plugins/imagePicker/图库插件
15.引用的cordova.js不要删除
16.在电脑上测试
ionic server