Repository navigation
Ionic serve for DevApp doesn't work for Ionic React project #4250
Description
Description:
When I try to run ionic serve --devapp it shows an error saying Ionic doesn't support using Cordova for @ionic/react projects.
It worked for me before on this project, but yesterday I've been reinstalling node etc. and after that it started happening.
I've tried adding capacitor, using older Ionic version (5.4.12), reinstalling node, npm, ionic etc., but nothing worked. Regular ionic serve works, --lab option as well.
Steps to Reproduce:
ionic start IonicTest blank --type=react
cd IonicTest
ionic serve --devapp
Output:
ionic:lib Terminal info: { ci: false, shell: '/bin/zsh', tty: true, windows: false } +0ms
ionic:lib CLI global options: { _: [ 'serve' ], help: null, h: null, verbose: true, quiet: null, interactive: true, color: true, confirm: null, json: null, devapp: true, project: null, '--': [] } +4ms
ionic:lib:project Project type from config: @ionic/react (react) +0ms
ionic:lib:project Project details: { configPath: '/Users/almirsarajcic/Projects/Optimum/currency-watch-ionic/ionic.config.json', errors: [], context: 'app', type: 'react' } +0ms
ionic Context: { binPath: '/usr/local/lib/node_modules/ionic/bin/ionic', libPath: '/usr/local/lib/node_modules/ionic', execPath: '/Users/almirsarajcic/Projects/Optimum/currency-watch-ionic', version: '5.4.13' } +0ms
> ionic integrations enable cordova
ionic:lib:telemetry Sending telemetry for command: 'ionic serve' [
ionic:lib:telemetry '--devapp',
ionic:lib:telemetry '--verbose',
ionic:lib:telemetry '--interactive',
ionic:lib:telemetry '--color',
ionic:lib:telemetry '--address=0.0.0.0'
ionic:lib:telemetry ] +0ms
ionic:lib:telemetry Sending telemetry for command: 'ionic integrations enable' [ 'cordova', '--interactive', '--color' ] +1ms
[ERROR] Ionic doesn't support using Cordova with @ionic/react projects.
We encourage you to try ⚡️ Capacitor ⚡️ (https://ion.link/capacitor)
ionic:utils-process onBeforeExit handler: 'process.exit' received +0ms
ionic:utils-process onBeforeExit handler: running 0 functions +0ms
ionic:utils-process processExit: exiting (exit code: 1) +1ms
My ionic info:
Ionic:
Ionic CLI : 5.4.13 (/usr/local/lib/node_modules/ionic)
Ionic Framework : @ionic/react 4.11.5
Utility:
cordova-res : not installed
native-run : not installed
System:
NodeJS : v13.3.0 (/usr/local/Cellar/node/13.3.0/bin/node)
npm : 6.13.2
OS : macOS Catalina
Activity
alberteddu commentedon Dec 16, 2019
I am also having the same problem. I was very confused because I clearly remember this working for me before, but I see now I am not the only one.
migtam628 commentedon Dec 17, 2019
hey guys.. i'm having the same problem. but if you run
ionic serve -cand then enter the IP and Port manually you can still use DevApp. I know its not what we like and want but its a temp fix until they fix it I guess. Hope this helps.migtam628 commentedon Dec 17, 2019
i got an update for ya'll. uninstall ionic
npm uninstall -g ionicand reinstall it with version 5.4.9npm i -g ionci@5.4.9On version 5.4.10 Ionic Change Log there's a bug fix for Cordova. One of the first command the program runs it's
ionic integrations enable cordova. Cordova it's not compatible with@ionic/reactin this new version of Ionic. I hope the Ionic Team will have a fix for that soon.dotNetkow commentedon Dec 17, 2019
Hey everyone, Ionic DevApp was originally built for Angular and Cordova. Moving forward, our official support for Ionic React includes Capacitor as the native runtime, along with each native platform's tooling (Xcode, Android Studio, etc.). The main reason is to provide a better experience for you - less tooling to maintain and troubleshoot on both sides.
Get started here. In terms of development speed comparing this to DevApp, there's actually not much difference. You open the native tool with Capacitor (
npx cap open iosfor example), then press Play to launch your Ionic React app onto a device (or simulator).docs(devapp): explain why React/Capacitor doesn't work with DevApp