已有iOS项目集成Cordova(PhoneGap)

1.安装PhoneGap

直接下载的安装包似乎不能使用命令行操作?我当时反正是没成功
首先进入 https://nodejs.org/en/ 下载nodejs,这里有一个大众版本和最新版本,下载大众版本就行。
安装完毕以后打开终端
npm install -g phonegap@latest
等待安装完成

2.新建PhoneGap项目

安装完毕后,cd到你想创建的目录,比如手动创建一个PhoneGapDemo文件夹,cd进去
phonegap create Demo com.demo.app Demo
如果你安装的是Cordova就将命令中的phonegap换成cordova,
上述命令,第一个Demo表示这个程序的名字,同时会创建一个Demo目录保存程序的代码,第二个参数com.demo.app表示代码中包的名字,第三个参数Demo表示创建的应用的名字。
此时的目录是.../PhoneGapDeme/Demo

Paste_Image.png

继续,cd进Demo文件夹后
phonegap platform add ios
完成以后,目录变为
Paste_Image.png
到此,新建PhoneGap项目完成

3.已有项目集成

假如我现在有个项目,叫WeChat。

  1. 打开WeChat文件目录
  2. 打开刚才新建的Demo,将Demo下的config.xml拷贝过去
  3. 进入platforms/ios,将cordova和www文件夹拷贝过去
  4. 将cordovaLib文件夹下全部内容拷贝过去
  5. 打开WeChat项目,Add Files添加CordovaLib.xcodeproj 和 config.xml
  6. 此时的结构


    Paste_Image.png
  7. 选择主项目,进入Build Phases,在Target Dependencies 和Link Binary 中添加Cordova


    Paste_Image.png
  8. buiild stetings 的 otherLiner flags 添加 -all_load-Objc
    Paste_Image.png
  9. 编译一下,应该能编译成功,也可能会报找不到pch文件的错误什么的,去CordovaLib.xcodeproj 里设置一下pch的路径就行了
  10. #import "Cordova/CDVViewController.h"后,使用CDVViewController就可以了,但是此时是没有资源文件的,所以还剩最后一步,添加资源
  11. 添加www文件夹,这里注意,不要直接Add Files添加,要拖进去,并且Added folders要选择folder references,这样添加进去的文件夹是蓝色的,此时运行,正常显示
    Paste_Image.png
  12. 这里的www文件夹一定要是蓝色的才可以,如果是黄色的文件夹,会提示找不到www里的index.html


    Paste_Image.png

    当然这个www路径和Index.html的名字什么的都可以去CordovaLib.xcodeproj中修改

  13. 以上完成以后,应该就可以正常运行了,不会有异常,但是在 Archive 的时候,会提示找不到文件
    Paste_Image.png

    网上查了一下,有好多人有这个情况,解决办法是 Header Search Path 加入
    "$(OBJROOT)/UninstalledProducts/$(PLATFORM_NAME)/include"
    这个方法似乎对大多数人都凑效了,然而,
    并没有什么卵用,还是报错,最后终于找到一个大神的解决方法
    在 Header Search Path 加入
    "$(BUILT_PRODUCTS_DIR)" "$(OBJROOT)/UninstalledProducts/include" "$(TARGET_BUILD_DIR)/usr/local/lib/include”

解决。

推荐阅读更多精彩内容