最近在學(xué)習(xí)混合開發(fā) 對于iOS原生組件的創(chuàng)建并使用 分享并記錄一下自己的經(jīng)驗 希望對新人有所幫助(我使用的是cordova + vue 進(jìn)行開發(fā))
1.創(chuàng)建一個cordova項目右莱,并添加iOS?platforms
cordova create CordovaProject
cd CordovaProject/
cordova platform add ios --save
2.創(chuàng)建插件
plugman create --name [插件名] --plugin_id [插件id] --plugin_version [插件版本]
cd ..
plugman create --name CHPlugin --plugin_id CHPlugin --plugin_version 1.0.0
3.使用xcode創(chuàng)建源文件胯甩,在src目錄下中創(chuàng)建ios文件夾 并將源文件放入其中
注意創(chuàng)建出來的類要繼承CDVPlugin類
4.修改plugin.xml中的內(nèi)容 并添加一個package.json文件
修改完后的內(nèi)容
要添加的json文件
5.修改www中的js文件
這樣一個原生組件基本就完成了,接著把這個組件加入到cordova項目中
6.把組件加入項目
cd CordovaProject/
cordova plugin add 【CHPlugin路徑】
補充 :(cordova plugin rm 【組件名稱】//刪除組件)
提示如上圖表示項目安裝組件成功了
7.在vue中使用這個組件
在index.html中加入如下代碼
在需要的地方使用
然后打包 npm run build 將dist文件中的內(nèi)容復(fù)制到CordovaProject/platforms/ios/www 目錄下 然后運行項目
8.大功告成
有些教程上會讓我們修改config.xml 還有其他一些文件中的內(nèi)容 其實是不用的 使用了cordova plugin add 命令系統(tǒng)會自動的幫我們填寫其中的內(nèi)容
讓我不解的是cordova這個目錄結(jié)構(gòu) 為什么iOS文件夾下還有個www目錄 這個www目錄不應(yīng)該是各個平臺共享的嗎
有什么說的不對的地方歡迎大家指教