Inertia on iOS

And other useful hints

Author: simonhamp

resources/views/docs/mobile/1/getting-started/development.md

@@ -3,18 +3,20 @@ title: Development
 order: 300
 ---
 
-## Building
-
-Building your NativePHP apps can be done completely in the browser with the workflows you're already familiar with.
+Developing your NativePHP apps can be done in the browser, using workflows with which you're already familiar.
 
 This allows you to iterate rapidly on parts like the UI and major functionality, even using your favorite tools for
 testing etc.
 
-But when you want to test _native_ features, then you must run it on a real/emulated device.
+But when you want to test _native_ features, then you must run your app on a real/emulated device.
 
 Whether you run your native app on an emulated or real device, it will always require compilation after changes have
 been made.
 
+<aside class="relative z-0 mt-5 overflow-hidden rounded-2xl bg-pink-50 px-5 ring-1 ring-black/5 dark:bg-pink-600/10">
+
+#### Platforms
+
 We've worked incredibly hard to ensure that your apps will operate almost identically across both platforms - aside
 from obvious platform differences. For the most part, you should be able to build without thinking about which platform
 your app is running on, but if you do need to, you can check by using one of the following helper methods:
@@ -26,6 +28,38 @@ System::isIos() // -> `true` on iOS
 System::isAndroid() // -> `true` on Android
 ```
 
+</aside>
+
+## Build your frontend
+
+If you're using Vite or similar tooling to build any part of your UI (e.g. for React/Vue, Tailwind etc), you'll need
+to run your asset build command _before_ compiling your app.
+
+### Inertia on iOS
+
+Due to the way your apps are configured to work on iOS, we need to patch the Axios package to make Inertia work.
+
+We've tried to make this as straightforward as possible. Simply run:
+
+```shell
+php artisan native:patch-inertia
+```
+
+This will backup your current `vite.config.js` and replace it with one that 'fixes' Axios.
+
+You will just need to copy over any specific config (plugins etc) from your old Vite config to this new one.
+
+Once that's done, you'll need to adjust your Vite build command for when you're creating iOS builds. _Only_ for iOS
+builds. (If you try to run these builds on Android they probably won't work.)
+
+Add the `--mode=ios` to your build command. Run it before compiling your app for iOS. Here's an example using `npm`:
+
+```shell
+npm run build -- --mode=ios
+```
+
+## Compile your app
+
 To compile and run your app, simply run:
 
 ```shell
@@ -37,9 +71,12 @@ learn any new editors or platform-specific tools.
 
 <aside class="relative z-0 mt-5 overflow-hidden rounded-2xl bg-pink-50 px-5 ring-1 ring-black/5 dark:bg-pink-600/10">
 
-#### Rule of Thumb
+#### Rule of thumb
 
 During development, keep `NATIVEPHP_APP_VERSION=DEBUG` to always refresh the Laravel application inside the native app.
+Your app will boot a little slower, but you will find that everything looks as you expect.
+
+It's better than scratching your head for an hour trying to figure out why your changes aren't showing!
 
 </aside>
 
@@ -56,17 +93,25 @@ php artisan native:open
 
 ## Hot Reloading (Experimental)
 
+We've tried to make compiling your apps as fast as possible, but when coming from the 'make a change; hit refresh'-world
+of PHP development that we all love, compiling apps can feel like a slow and time-consuming process.
+
+So we've released an early version of hot reloading, which aims to make your development experience feel just like home. 
+
 You can enable hot reloading by adding the `--watch` flag when running the `native:run` command:
 
 ```shell
 php artisan native:run --watch
 ```
 
-This is useful during development for quickly testing changes without rebuilding the entire app.
+This is useful during development for quickly testing changes without re-compiling your entire app. When you make
+changes to any files in your Laravel app, the web view will be reloaded and your changes should show almost immediately.
 
 ### Caveats
 
-This feature is currently best suited for **Blade** and **Livewire** applications. It does not work so well if you're
+For now, hot reloading only works in emulators, not on real devices.
+
+Also, it's currently best suited for **Blade** and **Livewire** applications. It doesn't work so well if you're
 also trying to hot reload compiled frontends using something like Vite's hot reloading.
 
 ## Releasing
@@ -111,3 +156,17 @@ submit it to the stores for approval and distribution.
 
 - [Google Play Store submission guidelines](https://support.google.com/googleplay/android-developer/answer/9859152?hl=en-GB#zippy=%2Cmaximum-size-limit)
 - [Apple App Store submission guidelines](https://developer.apple.com/ios/submit/)
+
+<aside class="relative z-0 mt-5 overflow-hidden rounded-2xl bg-pink-50 px-5 ring-1 ring-black/5 dark:bg-pink-600/10">
+
+#### Skip the prompts
+
+If you are tired of prompts, you can run most commands - like `native:run` - with the arguments and options that will
+allow you to skip through the various prompts. Use the `--help` flag on a command to find out what values you can 
+pass directly to it:
+
+```shell
+php artisan native:run --help
+```
+
+</aside>