vibe coding制作网页已经很容易,但是我们每天使用的APP,少有教程。不要觉得APP开发是天方夜谭,其实AI编程工具完全可以实现。vibe coding强调只要会说话,就能开发编程,其实安卓APP开发也很简单。
经过本人一天实验,从零开始,跟着我的保姆级喂饭教程,一步一步实现也很容易。
学习AI,最重要的是要用起来,参加我们的<vibe coding解决100个问题>,一起快速成长吧。
【vibe coding解决100个问题】AI编程完全手册2025版
https://xiaojuzi.feishu.cn/wiki/A0ZAwyI2FiZ1B8k8fcocCH1wnqh
如果你也想在AI时代开发一个小项目,也许你完全不懂编程?也许你学过编程但是不懂
如何从0到1搭建一个MVP项目?欢迎来聊,这是一个以Augment/Cursor实战为
主,以实战案例的形式开发几十个项目,包括:网站、微信小程序、浏览器插件、App应
用、Dify+Coze智能体。
为什么选择Cordova?
网上那么多开发工具,为什么要用Cordova?
简单来说,Cordova就像是一个"翻译官"。你只需要会做网页,它就能帮你把网页变成真正的手机app。这个优势是无与伦比的:
- 用户不需要学习复杂的Java或Kotlin
- 开发一套代码,可以同时在安卓和苹果手机上运行
- 开发速度快,维护成本低
听起来很美好?确实如此,但前提是你得先把开发环境搭建好。因为10分钟的教程,有9分钟都在安装各种环境。
开始前的心理准备
对于新手而言,环境搭建折磨的心力憔悴欲罢不能,稍微和教程不一样就很心慌,一个小细节没注意就卡半天。我在这里把所有遇到的问题都跟大家讲清楚,争取一次搞定。如果遇到问题,请直接复制错误信息,让AI解决。新手用户遇到的任务任务,AI都遇到过,有一个不藏私水平还可以的师傅,千万要用好它。
环境搭建:一步都不能错,一步都不能错
安装Node.js - 这是基础
Node.js就像是你电脑上的"工具箱",很多开发软件都需要它。
访问Node.js官网,下载最新版本就行。安装过程很简单,一路点"下一步"就可以了。
安装完成后,打开命令行(Windows按Win键搜索"cmd"),输入:
node -v
npm -v
看到版本号就说明安装成功了。
安装Cordova
有了Node.js,安装Cordova就简单了:
npm install -g cordova
这个命令会从网上下载Cordova并安装到你的电脑上。
Java环境 - 必须是17版本
安卓开发离不开Java,而且版本必须对,不然后面会报错。
去官网下载Java 17版本,安装时记得勾选"自动配置环境变量",这样就不用手动设置了。
装好后测试一下:
java -version
Java 17
看到java 17.x.x就对了。
Gradle - 项目构建工具
Gradle负责把你的代码打包成app,版本必须是8.13。
下载后解压到一个没有中文的路径(这很重要,不要有中文目录的字符!)。比如解压到C:\gradle-8.13。
接下来要设置环境变量:
- 新建GRADLE_HOME,值是你的Gradle路径C:\gradle-8.13
- 在Path里添加%GRADLE_HOME%\bin
设置完测试:
gradle -v
grade下载 必须是grade 8.13
Android studio下载
这是最复杂但也最重要的一步。Android Studio不仅是个开发工具,它还会帮你安装Android开发需要的所有组件。
下载安装包后运行,过程比较简单。关键是第一次打开时会提示安装Android SDK,这时候要注意:
千万不要把**SDK安装到包含中文的路径!**
我就是因为用户名是中文,后面遇到了各种问题。建议安装到类似C:\Android\Sdk这样的路径。
安装过程会比较久,特别是如果你的网络不太好的话。耐心等待就行。
环境变量设置
Android相关的环境变量也要设置:
- ANDROID_HOME:你的Android SDK路径
- 在Path里添加SDK的platform-tools路径
设置完可以测试:
adb version
创建虚拟手机
为了方便调试,建议创建一个虚拟的安卓手机。
在Android Studio里打开设备管理器,添加新设备。选择一个常见的手机型号,API级别选高一点的(比如API 30以上)。
创建完成后运行,如果能正常启动虚拟手机,说明环境基本没问题了。
开始第一个APP
请帮我开发一个Cordova app,功能是精美的贪吃蛇游戏。
请确保代码兼容Cordova框架,并且能在安卓设备上正常运行。
用AI生成你的第一个App
环境搭建完成后,真正的乐趣才开始!
创建项目
找个合适的文件夹,打开cmd命令行,在没有中文字符的目录下,输入以下指令:
cordova create MyFirstGame com.example.myfirstgame MyFirstGame
这会创建一个名为MyFirstGame的项目文件夹。
让**AI帮你写代码**
现在可以用AI来生成app代码了。用Cursor打开创建的文件夹MyFirstGame。Agent模式输入如下提示词:
请帮我开发一个Cordova app,功能是[你想要的功能]。
请确保代码兼容Cordova框架,并且能在安卓设备上正常运行。
AI会生成HTML、CSS和JavaScript文件,把这些文件放到项目的www文件夹里。
用户可以在www目录下,先体验一下HTML网页版的功能。
添加安卓平台
在项目目录下执行:
cordova platform add android
这会为你的项目添加安卓支持。
打包成APK
激动人心的时刻来了!执行:
cordova build android
如果一切顺利,你会在
platforms/android/app/build/outputs/apk/debug文件夹里找到你的第一个APK文件!
在虚拟手机上测试
启动Android Studio的虚拟设备,然后执行:
cordova run android
你的app就会自动安装到虚拟手机上并运行。
常见问题解决
路径包含中文
这是最常见的问题。如果你的用户名是中文,建议:
- 创建一个英文的工作目录
- 或者设置ANDROID_AVD_HOME环境变量到英文路径
缺少权限
Windows用户可能遇到PowerShell执行策略问题,解决方法:
Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUser
网络问题
如果下载速度很慢,可以:
- 使用手机热点
- 使用网线,或者换个网络较佳
版本不匹配
严格按照版本要求安装,特别是Java和Gradle的版本。
进阶技巧
添加插件
Cordova有很多插件可以调用手机的原生功能,比如相机、GPS等:
cordova plugin add cordova-plugin-camera
调试技巧
使用Chrome开发者工具可以调试在虚拟手机上运行的app,就像调试网页一样方便。
图标和启动页
别忘了为你的app设计图标和启动页,这会让app看起来更专业。
现实期待管理
Cordova确实很强大,但也有一些局限性:
适合的场景:
- 简单的工具类app
- 内容展示类app
- 已有网站想快速转成app
不太适合的场景:
- 需要大量原生功能的复杂app
- 对性能要求很高的游戏
- 需要复杂动画效果的app
最后想说的话
做出第一个能运行的app,那种成就感真的很棒。虽然过程可能有点折腾,但只要耐心一点,问题都能解决。
记住,遇到问题不要慌,现在有AI帮忙,大部分问题都能快速解决。重要的是迈出第一步,开始动手实践。
你的第一个app可能很简单,但这是一个很好的开始。随着经验积累,你能做出的东西会越来越酷。
现在就开始行动吧,说不定下个月你就能向朋友炫耀你自己做的app了!