iT邦幫忙

2021 iThome 鐵人賽

1
Modern Web

React Native & Redux 初步探討系列 第 33

Day 33 打包-ios (部分)

昨天說的是 Android 今天我們來聊聊如何打包 ios,

但因為沒有開發帳號,所以就只說 react native 的部份,

jsbundle

iosandroid 不太一樣的是,

ios 要先把我們的 js 這塊打包成 jsbundle

指令如下:

react-native bundle --entry-file index.js --platform ios --dev false --bundle-output ios/bundle/main.jsbundle --assets-dest ios/bundle

相關參數:

  • entry-file : 程式進入點的檔案,就是 index.js
  • platform : 平台 ios
  • dev: 設 false 會對檔案進行優化
  • bundle-output: 輸出位置
  • assets-dest: 打包資源檔

這串指令的意思是說:

進入檔是 index.js ,輸出檔案到 ios/bundle ,命名為 main.jsbundle, 最後把資源檔打包到 ios/bundle

大概 4 這樣

成功後可以在指定資料夾上看到 main.jsbundle

之後轉移陣地去 xcode

匯入 jsbundle

xcode 版本 : 12.0

進入 xcode , 選擇專案時,請選擇 /ios/*.xcodeproj

https://ithelp.ithome.com.tw/upload/images/20211019/20112878fJe0cnZVNn.png

打開後如上

在黃色資料夾上案右鍵, 選擇 Add files to "project"

https://ithelp.ithome.com.tw/upload/images/20211019/20112878jemBrKWibg.png

再來會看到以下畫面,

https://ithelp.ithome.com.tw/upload/images/20211019/20112878bRIbbJhu33.png

這時選擇 options

進入到選擇檔案的畫面,

https://ithelp.ithome.com.tw/upload/images/20211019/20112878l8B9spsG56.png

確定選擇 ios/bundle 資料夾,

最後加入後的畫面

https://ithelp.ithome.com.tw/upload/images/20211019/20112878NjkLrscyGk.png

react native 的部份就到這邊結束,再來就是 ios 的打包環節了,不過由於我沒開發帳號,只能做到這裡了....

哪天有錢買個帳號來試看看吧XDDD


上一篇
Day 32 打包- android
系列文
React Native & Redux 初步探討33

尚未有邦友留言

立即登入留言