I've built an app using React js and built that as an ipa file (the target devices are iPads) using Ionic AppFlow. This app utilises a google drive connection to create folders and upload files, which I've tested while running through both npm start and ionic serve and have been able to verify that the google drive authentication and functionality work as intended when run on Chrome on Windows and Safari on both mac OS and iOS. Post-build, I get an error that reads that me.a.client.drive is undefined, with that error being consistent regardless of if I'm using import { gapi } from 'gapi-script' or loading it (through the same npm module) to load gapi as part of the window using the loadGapiInsideDOM function. Is there something I'm missing about how to set up a functional google drive client using this setup? Thanks!
Related
I am uploading my Ionic Capacitor app to TestFlight using a paid developer account and it continues to be configured to use the localhost hostname for the URL.
I have tried a plethora of commands for building the project out to XCode.
ionic capacitor run ios --external --prod
ionic build
ionic cap sync
ionic cap copy
ionic capacitor build ios --prod
I am still learning the process, is it supposed to run on localhost when you use TestFlight?
This is the capacitor.config.ts file:
import { CapacitorConfig } from "#capacitor/cli";
const config: CapacitorConfig = {
appId: "com.traineraid",
appName: "Traineraid",
webDir: "build",
bundledWebRuntime: false,
server: {},
};
export default config;
One of the main reasons I am having difficulty is the I have firebase emulators set up that run instead of the production server when using a localhost URL, so when open the app using TestFlight on my phone, it warns me it is trying to use the emulators, which I don't have running, and it obviously can't work.
Is there a step of piece that is missing from this that is causing these problems? Or is this how it actually is supposed to operate and the code is what needs to change?
Capacitor apps ship with the app files bundled inside the app, so there is no “production server”, all the files are local.
Capacitor serves the local files from capacitor://localhost on iOS and http://localhost on Android, because you need an url to load in the app, but the url doesn’t really matter much.
When you run ionic capacitor run ios --external --prod it uses a local dev web server, but that’s just to allow live reload and making development easier, but for publishing the app you don’t need a server. Just run ionic build and then npx cap copy and all the files will be copied to the app bundle.
Technologies used
I have a TODO app developed in Gatsby, using Firebase Firestore to store the data and read from it
I have used gatsby-starter-capacitor project as a starter template. Why? I want my app to run both on iOS and Android.
What I have right now?
My local build when using npx gatsby develop, I can see the site I have created. I have successfully deployed my app to Netlify as well.
Also, I can run my app on iOS device, I did npm run build && npx cap copy ios && npx cap open ios
For Firebase, I have created a web app in my Firebase console, and used the details on my Gatsby App template. The Firebase details for the WebApp, e.g. Keys and etc, are in a .env file, which I have declared and uploaded on Netlify Environment Variables section
This launches my app on my iPhone - Fantastic.
Localhost: I can save and read data from Firebase and can see the data appearing saved on Firebase console. (Awesome)
Problem
App on iPhone/Netlify loads on a fresh slate, the data is not read from Firebase.
How do I productionise my app so my friends can use it when I release it in Appstore. Because, currently when my app runs on an iOS device, it is running on its localhost? or something that I am not sure of. My app is already running on Netlify, how do I connect this iOS project to go to that URL?
Basically, I want users to be able use this app and read/write to Firebase (which currently works on localhost).
My Problem:
I recently became the new Dev in a system which has a backend with Dotnet 3.1 and a Frontend of React, TypeScript and it is build with Yarn.
I can run the whole monster. For this, I first build the frontend, copy the created .js files to a static files folder in the backend, and run the Monster.dll.
How to debug the frontend? (I am afraid it relies on the backend being available.)
So far I tried to use Visual Studio but I'd try anything that is free and runs on Linux.
Seems you confused the front-end environment with the back-end.
Basically, your React front-end application runs on browsers whereas dotnetCore application runs on CoreCLR. Meaning that you can debug your React front-end application in browser's Developer Tools in a basic way.
Ensure that the build operation of your React front-end app generates source map (*.map) files. These files map your browser compatible js output files to the tsx / ts sources. Then you should be able to debug it on your browser's Developer Tool.
I have implemented a camera functionality in an ionic-angular based application.I am getting an error Camera is not defined.The above mentioned error is occurring when I am using the command ionic serve.The issue doesn't exist when command ionic browser is used.Also getting the same error Camera is not defined when I deployed the app to firebase.Any suggestions for steps I need to follow while deploying the app to firebase to avoid the error ?
Below is the behavior I could see.
I used the command ionic serve.
The Camera plugin doesn't loads in browser view and I could see the following error.
Error from browser
On using the command ionic run browser,Could see camera getting loaded.This is browser view.ionic run browser
This application is deployed using firebase deploy command and hosted in a firebase environment.I could see the same behavior ie(Camera not loading) when accessed the url through an android phone(Moto X Play). Is this expected?.Do I need to execute some other steps while deploying my application to firebase.
Also I have included the ngCordova dependencies in my app.js and included the cordova.js just before ng-cordova.js in my index.html.Currently this app is not installed in playstore or Apple app store.This application is developed in ionic and can be viewed in mobile device by accessing firebase hosting url in which the application is deployed.
Camera plugin is a cordova plugin.and some cordova plugins doesn't support in browser. so install your app into mobile, it will work fine.
I have a webapp which I build with Angularjs 2.0, I want to convert it to android apk and install it on android phone and test.
I dont have any experience in building mobile native app or converting webapp to native app.
I have gone through How to convert an existing AngularJS web app to a Cordova app?
Any suggestion/guidance will be helpful.
The most simple explanation is you will need to put your angular files in the www folder, setup your configuration file, make sure the android platform is installed, then run the Android emulate and/or build command to see if it works. That's a very oversimplified version.
Once you've got it working there's a process to go through to prepare the apk to be uploaded to the Google Play Store. You have to be a registered developer for the play store, which is $25/year.
https://scotch.io/#vijayk036/building-hybrid-mobile-apps-using-cordova-and-angularjs-for-android
https://thebhwgroup.com/blog/converting-angularjs-website-cordova-app-ios-and-android