@@AaronSaundersCI Hey, I have been able to follow the guide, however I am having problems when using a dev-container in VScode. The live reload does not work and i have to manually refresh. Also ADB devices works outside of the container, but not within. I think it is a port issue, have you experienced this before?
@@AaronSaundersCI I am using it to store the ionic-vscode plugin settings so that other developers will have it installed in their dev environment along with other config like prettier. It uses docker, its really useful when it works! I found an article to help with that part
Hi Aaron, thanks for sharing! I followed your tutorial and was able to run the vite-vue template on android and web, do you have some recommendations regarding the UI/UX how to create simple layouts or some tips? Not sure if I should go with HTML CSS like web development, or use some library to create app-like components?
i usually suggest that if you are just starting out to use ionic components so that you can get the win of getting the first application built and learn the whole process. After that there are component frameworks like Konsta, Vuetify, and Quasar
Thank you very much Aaron ! Just a question, when you launched IOs build and emulator, did you have to have XCode installed locally ? Thank you in advance,
Hey Aaron, thank you very much for your work. I got a question, I have a problem with vuefire and ionic. router.beforeEach(async (to) => { const requiresAuth = to.matched.some(record => record.meta.requiresAuth); const user = await getCurrentUser(); if (requiresAuth && !user) { return '/login'; } }) When the app started up It showed me a white page, and the problem is with getCurrentUser of vuefire. Do you knwo why?
@@AaronSaundersCI no worries. I got it to a point where no errors were shown in the logs anymore. But I think it might be because I left out the build or a wrong setting in the webdir
When I try to run the iphone 14 ios 16.4 simulator ( or any other simulator in my list ) I gets stuck at "{simulator name }: Building Native..." in the output it's periodically logging [INFO] Waiting for connectivity with npm... Any suggestions?
Do i need to install other applications? Like Android Studio so the simulator works? My Simulator isn't running or starting... i tried both IOS and Android and they both silently fail... it starts for a few seconds and just shuts off.... HELP.
Could not open settings generic class cache for settings file 'C:\dev\appName\android\settings.gradle' (C:\Users\user\.gradle\caches\8.0.2\scripts\41bleq3pqmzd04rqmo279sxv9). > BUG! exception in phase 'semantic analysis' in source unit '_BuildScript_' Unsupported class file major version 65 No idea how to fix this......
the code is a bit old, and android gradle upgrade issues can create problems, but once you get it locked in, you are usually good to go. Glad it worked out for you
hey , thanks for your video , but i have problem i cant solve it , i don´t know why, but when i try to run in IOS only show me a notification that says "Unable to find any devices , same happen when i clicked to andiord exactly the same , i did everything like your tutorial !!! and my OS is windows 10 , could you please guide me !
i get this issue trying to run iOS simulator : [Ionic] iPhone 14 Pro (simulator) iOS 16.4... > npx ionic cap run ios --target=A2D34EFB-9691-4641-A53B-E696D4DFEA64 --livereload --external > capacitor sync ios ✔ Copying web assets from dist to ios/App/App/public in 33.07ms ✔ Creating capacitor.config.json in ios/App/App in 3.17ms ✔ copy ios in 74.61ms ✔ Updating iOS plugins in 813.29μs [info] Found 4 Capacitor plugins for ios: @capacitor/app@5.0.6 @capacitor/haptics@5.0.6 @capacitor/keyboard@5.0.6 @capacitor/status-bar@5.0.6 ✔ Updating iOS native dependencies with pod install in 9.48s ✔ update ios in 9.57s [info] Sync finished in 11.166s > npm run ionic:serve -- --host=0.0.0.0 --port=8101 [npm] > viteapp@0.0.0 ionic:serve [npm] > npm run dev --host=0.0.0.0 --port=8101 [npm] > viteapp@0.0.0 dev [npm] > vite [npm] VITE v4.4.6 ready in 1138 ms [npm] ➜ Local: localhost:5173/ [npm] ➜ Network: use --host to expose [INFO] Waiting for connectivity with npm... it just hangs on waiting for connectivity with npm.
![Seungmin "그렇게, 천천히, 우리(As we are)" | [Stray Kids : SKZ-PLAYER]](http://i.ytimg.com/vi/kAzmhLHePqU/mqdefault.jpg)
If you enjoyed the content you can help support the channel, consider hitting the THANK YOU button
Thanks for this video. Can’t wait to give Capacitor a try!
Thanks!
Thank You for your support
Worked like a charm thanks to your guidance, much appreciated
Glad it helped
Welcome back, Aaron!
thanks
Been struggling to do this with a svelte kit project. Will try this, thanks for making this video
wont work with anything that is doing SSR
@@AaronSaundersCI thanks, figured it out with the help of your video and another one. Works like a charm now, I had it configured to run CSR anyway
@@_jogicodes glad it worked out for you, I have dabbled with svelte but never really got to serious
Thanks for the video! Im going to be doing this but with react today 🙂
I am certain I have a react video here somewhere doing the same
@@AaronSaundersCI Hey, I have been able to follow the guide, however I am having problems when using a dev-container in VScode. The live reload does not work and i have to manually refresh. Also ADB devices works outside of the container, but not within. I think it is a port issue, have you experienced this before?
@@knobbler2003 I have never used a dev-container… don’t even know what it is. Are u using the ionic-vscode plugin?
@@AaronSaundersCI I am using it to store the ionic-vscode plugin settings so that other developers will have it installed in their dev environment along with other config like prettier. It uses docker, its really useful when it works! I found an article to help with that part
This is nice man. Thanks
Glad you like it!
Hi Aaron, thanks for sharing! I followed your tutorial and was able to run the vite-vue template on android and web, do you have some recommendations regarding the UI/UX how to create simple layouts or some tips? Not sure if I should go with HTML CSS like web development, or use some library to create app-like components?
i usually suggest that if you are just starting out to use ionic components so that you can get the win of getting the first application built and learn the whole process. After that there are component frameworks like Konsta, Vuetify, and Quasar
Nice!
Thanks!
Thank you very much Aaron !
Just a question, when you launched IOs build and emulator, did you have to have XCode installed locally ?
Thank you in advance,
Yea
Very nice man!
¡Thanks a lot Aaron! 🧐
Glad you enjoyed it, please give video a like and subscribe to the channel
What is the app size after all these tools compared to if I have used just ReactNative?
Not sure, but honestly I have never once had a client ask me what the app size is, so I doing worry about that… 😬
nice
Super this!, can this just apply the mobile theme (ios/android)? when obviously is open on the mobile and the normal theme on the browser? . thanks!
If it is a chrome browser it will default to android and iOS on safari
@@AaronSaundersCI Thanks for your reply!
Very helpful, thanks! By any chance have you used Ionic and Interia for a mobile app?
Unfortunately not
So i can publish this build on the iPhone App Store?
YES
Hey Aaron, thank you very much for your work. I got a question, I have a problem with vuefire and ionic.
router.beforeEach(async (to) => {
const requiresAuth = to.matched.some(record => record.meta.requiresAuth);
const user = await getCurrentUser();
if (requiresAuth && !user) {
return '/login';
}
})
When the app started up It showed me a white page, and the problem is with getCurrentUser of vuefire. Do you knwo why?
Pleas post an issue in the project and show me the specifics of your main.ts, also I am assuming you are a subscriber 😬
## Series Playlist - ruclips.net/p/PL2PY2-9rsgl1qJS3CBrbJxmbLBDBa2E1x
i tried getting the capacitor example project running but it only showed a white splash screen. i'll have a look at the plugin when i have time again
Not really providing much information for me to provide any help, let me know how it goes moving forward
@@AaronSaundersCI no worries. I got it to a point where no errors were shown in the logs anymore. But I think it might be because I left out the build or a wrong setting in the webdir
When I try to run the iphone 14 ios 16.4 simulator ( or any other simulator in my list ) I gets stuck at "{simulator name }: Building Native..." in the output it's periodically logging [INFO] Waiting for connectivity with npm...
Any suggestions?
What command are I using to run the app
@@AaronSaundersCI I'm running on it via the extension UI, Run -> iOS. It builds and syncs properly.
@@timfranklin4724 can you show the log output? also are you running live reload?
Sorry, but maybe someone encountered an error:
[fatal] native-run
how did you solve the problem?
Linux Ubuntu 22.04
@@speedReadPro can u provide more information? But since u are on Linux, you should have set up Android studio to build solution for Android not iOS
Do i need to install other applications? Like Android Studio so the simulator works? My Simulator isn't running or starting... i tried both IOS and Android and they both silently fail... it starts for a few seconds and just shuts off.... HELP.
What I usually do is manually start Xcode and my simulator to make sure things are right if it doesn’t work the first time
for the record, I don't have android studio or anything downloaded other than what you showed in NPM and Ionic@@AaronSaundersCI
@@ALLCAPS required dependencies - capacitorjs.com/docs/v2/getting-started/dependencies
I don´t know why, but when i try to run in IOS only show me a notification that says "Unable to find any devices: irigin: Ionic (extension)"
i would need more information to be able to provide assistance. But I would first ensure that you have the proper libraries installed for capacitor
@@AaronSaundersCI forget it, it was just a firewall problem, i fixed it, thanks a lot for video
@@JulioCampoSwork what did you disable in firewall?
@@JulioCampoSwork how did you fix this please
I run cmd ionic cap run ios -l --external and stuck on [INFO] Waiting for connectivity with npm...
I fixed by edit script : "ionic:serve": "vite dev --host". Tks.
@@free_dev I don’t usuall run the commands directly, I use the vscode plugina
i dont know if its my java version this has not worked for me. ive tried everthing on windows 11
this video is good but it doesnt include the installation of java and all the necesarry dependencies for this to run. Now i am having trouble
if you go to the ionic website it will explain all that is needed to get capacitor up and running
Could not open settings generic class cache for settings file 'C:\dev\appName\android\settings.gradle' (C:\Users\user\.gradle\caches\8.0.2\scripts\41bleq3pqmzd04rqmo279sxv9).
> BUG! exception in phase 'semantic analysis' in source unit '_BuildScript_' Unsupported class file major version 65
No idea how to fix this......
8h later and tons of errors, downgrades, versions checks, path changes later i manage to make it work. now im not gonna turn of my PC ever again.....
the code is a bit old, and android gradle upgrade issues can create problems, but once you get it locked in, you are usually good to go. Glad it worked out for you
hey , thanks for your video , but i have problem i cant solve it , i don´t know why, but when i try to run in IOS only show me a notification that says "Unable to find any devices , same happen when i clicked to andiord exactly the same , i did everything like your tutorial !!! and my OS is windows 10 , could you please guide me !
Do you have Xcode or Android studio installed?
@@AaronSaundersCI same thing here, I have android studio installed but I get same issue
Can someone send me a link to a project?? Also I have found that on android I have to launch the emulator first
@@AaronSaundersCI i have OS windows obviously i don't have XCode i have installed android studio but still have problem
Please any hope on how to fix this?
Turning on live reload gets stuck at waiting for npm
Need more information? Can u point my top a sample project?
i get this issue trying to run iOS simulator :
[Ionic] iPhone 14 Pro (simulator) iOS 16.4...
> npx ionic cap run ios --target=A2D34EFB-9691-4641-A53B-E696D4DFEA64 --livereload --external
> capacitor sync ios
✔ Copying web assets from dist to ios/App/App/public in 33.07ms
✔ Creating capacitor.config.json in ios/App/App in 3.17ms
✔ copy ios in 74.61ms
✔ Updating iOS plugins in 813.29μs
[info] Found 4 Capacitor plugins for ios:
@capacitor/app@5.0.6
@capacitor/haptics@5.0.6
@capacitor/keyboard@5.0.6
@capacitor/status-bar@5.0.6
✔ Updating iOS native dependencies with pod install in 9.48s
✔ update ios in 9.57s
[info] Sync finished in 11.166s
> npm run ionic:serve -- --host=0.0.0.0 --port=8101
[npm] > viteapp@0.0.0 ionic:serve
[npm] > npm run dev --host=0.0.0.0 --port=8101
[npm] > viteapp@0.0.0 dev
[npm] > vite
[npm] VITE v4.4.6 ready in 1138 ms
[npm] ➜ Local: localhost:5173/
[npm] ➜ Network: use --host to expose
[INFO] Waiting for connectivity with npm...
it just hangs on waiting for connectivity with npm.
what does the script section of package.json look like?
i think i didnt miss a step but i get the "unable to find any devices" error when clicking on 'ios' or 'android' - what did i forget?
You have to have installed Xcode or android studio
@@AaronSaundersCI you sir are a saint! thanks i'll try that! :D
Free Palestine
Nice!
Thanks, glad you found it helpful please consider like and subscribe 🙏🏾
Free Palestine