Using ionic with android studio


#1

Hi
I spent a few days searching and trying different things. No luck.

I created an ionic 2 app with the cli. Now one wonders how to use a real IDE with the project. Importing it into AS or intelliJ produced a bunch of Cordova source stuff. Which I don’t care about.

It did not import the src or www directories which I do care about. Then trying to run the app failed. Some build failure in Cordova source code. It’s a hot mess.

  1. How does one debug (visually) an ionic 2 app? Just using browser?
  2. How can we use android studio to edit and manage project?

Thanks for any help.
I’m using ubuntu 16.04


#2

Android Studio is designed to work (mainly) with Java projects, not with JavaScript/TypeScript. I think you’re just trying to use the wrong tool for the job to be honest. If you like IntelliJ products (that’s what Android Studio is based on) perhaps WebStorm will look familiar.


#3

I’ll try it that way but it’s all the same IDE really and Google says to use with ionic import the Cordova project directory. The Cordova plugin is needed to build/run/test the ionic app redgardless.

So the question really is. How do other people build/edit/run ionic 2 apps from an IDE?


#4

Where does Google say that?


#5

A few Google results look like this one. Didn’t work for me but to be fair it’s a bit old. That’s why I’m asking here. What’s the best practice besides just use the CLI.

https://confluence.jetbrains.com/plugins/servlet/mobile#content/view/54345093


#6

Oh, Google as in search results. I thought you meant Google as in the Android documentation. :smile:

Personally I like the CLI, but WebStorm for one certainly has support for running Ionic commands from the IDE.


#7

How do you write javascript/html? You know syntax highlighting, code completion etc. That’s the issue. The client is nice but juggling between a code editor and CLI is not.

I want to edit my project in Webstorm and have it auto update etc. Has anyone ever done this?
It would be nice to just be able to create ionic project in Webstorm and not fuss with CLI.


#8

I use Visual Studio Code for editing, it’s open source and cross-platform . Start ionic serve from a terminal, edit code in the editor and the app updates automatically. I have some videos here if you’re interested.


#9

Ionic projects work very well with IntelliJ. It’s the only ide that provides you autoimport of modules. VS code does have some plugins for that but they do not work very well.


#10

I’ve been developing ionic and websites.for quite a while now.
I also developed native android.
However, your android knowledge won’t be used much in developing ionic.
Ionic is a framework. And it is a web-based application.
You might be thinking you will have to code ionic like android but it’s not. You will be coding ionic like websites.

To code ionic, open it with your best text editor, not an IDE. You may use, sublime, vs code, vim, etc.
Treat each development like building a website at src folder, and not www folder.
It will ‘transpile’ the src code to the www folder. (read that again).

To answer your question,

  1. You debug the application using the browser (like console) and/or using the server.
  2. You can use android studio for building the project, but not mainly to develop.
    Like in my case, I needed to use Android studio for Fabrics.

#11

One big drawback from Ionic is that the packager is behind a paywall, and android studio is free
even the MIT app appinventr is free if your app is simple that is your best choice


#12

The packager as in the service to build your app?

If so, then it’s not a fair comparison to Android Studio as it won’t build for iOS and Android.

A fairer comparison is comparing it to ionic cordova build platform, which is also free.


#13

Hello vincebanzon, can you give details on how you managed to install Fabric IDE plugin in Android Studio and use it with an Ionic 2 project ?
Did you distribute an app to testers with Beta ?
Thanks.


#14

Hi fabbiennb, I can’t be sure where you are right now but here’s my wild guess.
Build your ionic2 app first.
$ ionic cordova build android
Open your Android Studio then open your ionic 2 app android project at:
myproject/platforms/android/build.gradle
You should be able to continue installing your app to fabric. Just follow the instruction from fabric.
I tried to search the instruction I followed which has no code, but simply just how to setup the android studio to install fabric.
I guess I can’t find the instruction because I have already installed it.


#15

fabbiennb, Here it is! :slight_smile:

https://fabric.io/downloads/android