Cordova入门篇:(一) IDEA+Cordova运行第一个项目

原生应用:Android中是java,iOS中是Objective-C、Swift为主要语言进行开发。
纯Web应用:也就是所谓的响应式网站,在移动和PC中通过浏览器访问。
混合型应用:利用Web应用和原生应用婚后进行开发。比如展现部分用web在特定的webView中展示,部分核心功能依然是原生开发。

cordova会是这样一个混合型框架(一个好桥梁)。

网址:
http://cordova.apache.org
在这之前确保你已经安装好了node.js(内置npm)

#首先创建一个文件夹,cd进去
npm install cordova
#然后执行
npm init #会生成package.json

/cordova/npm:
Cordova入门篇:(一) IDEA+Cordova运行第一个项目_第1张图片

安装官方文档创建项目

cordova create 项目名 默认包名 应用名称

Cordova入门篇:(一) IDEA+Cordova运行第一个项目_第2张图片

编辑package.json

  "scripts": {
    "create": "cordova create myapp com.mydev.myapp myapp",
    "add-android":"cd myapp && cordova platforms add android"
  },

由于需要进入myapp才能加入Android支持,因此加入cd myapp(上面自动生成的文件夹)。

然后在终端执行:

npm run create

这里写图片描述
Cordova入门篇:(一) IDEA+Cordova运行第一个项目_第3张图片
(然后会多一个myapp文件夹)

创建完cordova项目之后,添加支持android平台
继续执行:

npm run add-android

Cordova入门篇:(一) IDEA+Cordova运行第一个项目_第4张图片

接下来使用IDEA导入项目

导入上面创建的myapp
Cordova入门篇:(一) IDEA+Cordova运行第一个项目_第5张图片
(IDEA导入的时候注意这一步,最后一个插件,我们不需要)

导入完成,看看目录,可以看就我们很熟悉的安卓配置文件
Cordova入门篇:(一) IDEA+Cordova运行第一个项目_第6张图片

Cordova入门篇:(一) IDEA+Cordova运行第一个项目_第7张图片
(再找找,可以找到src目录,下面有就是我们安卓的代码。从MainActivity.java代码可以看出是加载了一个index.html文件)

然后找到index.html文件,并做一点儿修改。
Cordova入门篇:(一) IDEA+Cordova运行第一个项目_第8张图片
运行项目在模拟器中查看:
Cordova入门篇:(一) IDEA+Cordova运行第一个项目_第9张图片

你可能感兴趣的:(Android开发基础)