為何捐款
API 瀏覽器
Quasar CLI (搭配 Webpack)
升級指南
新功能！
quasar.config 檔案
轉換為使用 Webpack 的 CLI
瀏覽器相容性
支援 TypeScript
目錄結構
命令列表
CSS 預處理器
路由
延遲載入 - 代碼分割
處理資源
啟動檔案
預取功能
API 代理
處理 Webpack
處理 process.env
使用 Pinia 的狀態管理
使用 Vuex 的狀態管理
Linter
測試與稽核
開發行動應用程式
Cordova 模式
簡介
準備工作
設定 Cordova
Cordova 應用程式圖示
Cordova 外掛程式
建置指令
疑難排解與提示
管理 Google Analytics
發佈到商店
Ajax 請求
公開開發伺服器
Quasar CLI 與 Webpack - @quasar/app-webpack
Cordova 應用程式圖示

Cordova 是所有建置目標中圖示設定最複雜的目標之一，因為您不僅需要將圖示放置在特定資料夾中，還需要將它們註冊到 src-cordova/config.xml 檔案中。此外，如果您使用啟動畫面（建議您應該使用），您還需要安裝 cordova-plugin-splashscreen 並在您的 config.xml 中註冊它。

如果您發現任何新增或遺失的檔案，請開啟 issue。

Icon Genie CLI

提示

我們強烈建議使用 Icon Genie CLI，因為它可以取用來源圖示，並自動為您複製、縮放、最小化圖示並將其放置在適當的目錄中。在需要時，它也會告訴您需要在 /index.html 或 /src/index.template.html 檔案中新增哪些標籤。

使用 Icon Genie CLI 快速啟動必要的圖片。如需完整的選項列表，請造訪 Icon Genie CLI 指令列表頁面。

$ icongenie generate -m cordova -i /path/to/source/icon.png [-b /path/to/background.png]

手動說明

除非您使用 Icon Genie CLI，否則這是您需要執行的操作

$ cd src-cordova
$ cordova plugin add cordova-plugin-splashscreen
$ cordova plugin save
src-cordova/
res/
android/
ldpi.png
# 36x36
mdpi.png
# 48x48
hdpi.png
# 72x72
xhdpi.png
# 96x96
xxhdpi.png
# 144x144
xxxhdpi.png
# 192x192
ios/
icon.png
# 57x57
icon@2x.png
# 144x144
icon-20@2x.png
icon-20@3x.png
icon-29.png
icon-29@2x.png
icon-29@3x.png
icon-40@2x.png
icon-60@2x.png
icon-60@3x.png
icon-20.png
icon-20@2x.png
icon-40.png
icon-50.png
icon-50@2x.png
icon-72.png
icon-72@2x.png
icon-76.png
icon-76@2x.png
icon-83.5@2x.png
icon-1024.png
icon-24@2x.png
icon-27.5@2x.png
icon-29@2x.png
icon-29@3x.png
icon-40@2x.png
icon-44@2x.png
icon-50@2x.png
icon-86@2x.png
icon-98@2x.png
screen/
android/
splash-land-ldpi.png
splash-port-ldpi.png
splash-land-mdpi.png
splash-port-mdpi.png
splash-land-hdpi.png
splash-port-hdpi.png
splash-land-xhdpi.png
splash-port-xhdpi.png
splash-land-xxhdpi.png
splash-port-xxhdpi.png
splash-land-xxxhdpi.png
splash-port-xxxhdpi.png
ios/
Default@2x~iphone~comcom.png
Default@2x~iphone~comany.png
Default@2x~iphone~anyany.png
Default@3x~iphone~anycom.png
Default@3x~iphone~comany.png
Default@3x~iphone~anyany.png
Default@2x~ipad~comany.png
Default@2x~ipad~anyany.png

以下是您的 config.xml 應有的部分內容

<platform name="android">
    <icon density="ldpi" src="res/android/ldpi.png" />
    <icon density="mdpi" src="res/android/mdpi.png" />
    <icon density="xxxhdpi" src="res/android/xxxhdpi.png" />
    <splash density="land-ldpi" src="res/screen/android/splash-land-ldpi.png" />
    <splash density="port-ldpi" src="res/screen/android/splash-port-ldpi.png" />
    <splash density="land-mdpi" src="res/screen/android/splash-land-mdpi.png" />
    <icon density="hdpi" src="res/android/hdpi.png" />
    <icon density="xxhdpi" src="res/android/xxhdpi.png" />
    <splash density="port-mdpi" src="res/screen/android/splash-port-mdpi.png" />
    <splash density="land-hdpi" src="res/screen/android/splash-land-hdpi.png" />
    <splash density="land-xxhdpi" src="res/screen/android/splash-land-xxhdpi.png" />
    <splash density="port-xxhdpi" src="res/screen/android/splash-port-xxhdpi.png" />
    <splash density="land-xxxhdpi" src="res/screen/android/splash-land-xxxhdpi.png" />
    <splash density="port-xxxhdpi" src="res/screen/android/splash-port-xxxhdpi.png" />
    <icon density="xhdpi" src="res/android/xhdpi.png" />
    <splash density="port-hdpi" src="res/screen/android/splash-port-hdpi.png" />
    <splash density="land-xhdpi" src="res/screen/android/splash-land-xhdpi.png" />
    <splash density="port-xhdpi" src="res/screen/android/splash-port-xhdpi.png" />
</platform>
<platform name="ios">
    <icon height="57" src="res/ios/icon.png" width="57" />
    <icon height="114" src="res/ios/icon@2x.png" width="114" />
    <splash src="res/screen/ios/Default@2x~iphone~comcom.png" />
    <icon height="60" src="res/ios/icon-20@3x.png" width="60" />
    <icon height="29" src="res/ios/icon-29.png" width="29" />
    <icon height="58" src="res/ios/icon-29@2x.png" width="58" />
    <icon height="87" src="res/ios/icon-29@3x.png" width="87" />
    <icon height="80" src="res/ios/icon-40@2x.png" width="80" />
    <icon height="120" src="res/ios/icon-60@2x.png" width="120" />
    <icon height="180" src="res/ios/icon-60@3x.png" width="180" />
    <icon height="20" src="res/ios/icon-20.png" width="20" />
    <icon height="40" src="res/ios/icon-20@2x.png" width="40" />
    <icon height="100" src="res/ios/icon-50@2x.png" width="100" />
    <icon height="72" src="res/ios/icon-72.png" width="72" />
    <icon height="144" src="res/ios/icon-72@2x.png" width="144" />
    <icon height="76" src="res/ios/icon-76.png" width="76" />
    <icon height="152" src="res/ios/icon-76@2x.png" width="152" />
    <icon height="167" src="res/ios/icon-83.5@2x.png" width="167" />
    <icon height="1024" src="res/ios/icon-1024.png" width="1024" />
    <icon height="48" src="res/ios/icon-24@2x.png" width="48" />
    <icon height="55" src="res/ios/icon-27.5@2x.png" width="55" />
    <icon height="88" src="res/ios/icon-44@2x.png" width="88" />
    <icon height="172" src="res/ios/icon-86@2x.png" width="172" />
    <icon height="196" src="res/ios/icon-98@2x.png" width="196" />
    <splash src="res/screen/ios/Default@2x~iphone~anyany.png" />
    <splash src="res/screen/ios/Default@3x~iphone~anyany.png" />
    <splash src="res/screen/ios/Default@3x~iphone~anycom.png" />
    <splash src="res/screen/ios/Default@3x~iphone~comany.png" />
    <splash src="res/screen/ios/Default@2x~ipad~anyany.png" />
    <splash src="res/screen/ios/Default@2x~ipad~comany.png" />
    <icon height="40" src="res/ios/icon-40.png" width="40" />
    <icon height="50" src="res/ios/icon-50.png" width="50" />
    <splash src="res/screen/ios/Default@2x~iphone~comany.png" />
    <splash src="res/screen/ios/Default-Landscape-2436h.png" />
    <splash src="res/screen/ios/Default@2x~iphone~anyany" />
    <splash src="res/screen/ios/Default@2x~iphone~comany" />
    <splash src="res/screen/ios/Default@2x~iphone~comcom" />
    <splash src="res/screen/ios/Default@3x~iphone~anyany" />
    <splash src="res/screen/ios/Default@3x~iphone~anycom" />
    <splash src="res/screen/ios/Default@3x~iphone~comany" />
    <splash src="res/screen/ios/Default@2x~ipad~anyany" />
    <splash src="res/screen/ios/Default@2x~ipad~comany" />
</platform>
準備好瞭解更多資訊了嗎？
Cordova 模式
設定 Cordova
Cordova 模式
Cordova 外掛程式
發現錯誤？在瀏覽器中編輯此頁面
1. 簡介
2. Icon Genie CLI
3. 手動說明
MIT 授權條款隱私權政策
版權所有 © 2015 年至今 PULSARDEV SRL，Razvan Stoenescu
本網站與 Dreamonkey Srl 合作設計