Skip to end of metadata
Go to start of metadata

Redirection Notice

Icon

This tutorial describes how to create and run PhoneGap, Apache Cordova and Ionic applications with IntelliJ IDEA.

Before you begin, make sure you that have PhoneGap/Cordova/Ionic CLI and corresponding platform tools such as XCode Tools and Android SDK.

1. Enable frameworks support

PhoneGap, Apache Cordova and Ionic frameworks support is available in IntelliJ IDEA, WebStorm and AppCode via this plugin. To install it, go toSettingsPluginsInstall JetBrains plugin…, then selectPhoneGap/Cordova Pluginand clickInstall plugin.

Icon

IntelliJ IDEA needs to be restarted to complete the plugin installation

2. Configure the executable path

The next step is to configure the executable path for PhoneGap/Cordova/Ionic CLI viaSettingsLanguages and FrameworksJavaScriptPhoneGap/Cordova.

3. Create or open an application

To open an existing PhoneGap/Cordova/Ionic application, simply select its folder via FileOpenmenu. Your IDE will detect the application and perform all required configuration steps automatically.

Creating a new application takes just a tad longer: clickFileNew Project…, then selectStatic Web, and thenPhoneGap/Cordova App.

Click Finish, and the IDE will create a new application and all the files it requires:

4. Run your application

To deploy and run your application, you need to create a so called Run Configuration. For that, go to RunRun Configurations…and use theAddbutton on the left to create aPhoneGap/Cordovarun configuration.

Notice that it's created with default path and other settings, but you can,of course, change any of them as you need.

Icon

You can't select a target device from the IDE when using PhoneGap CLI due the existing limitations.

After the configuration is saved, use it to run your application via Runbutton on the toolbar or via theRunmenu:

In theRuntool window that appears after the application is started you can find the output and logs:

If you're using theemulatecommand, an emulator will be automatically launched before application deployment.

  • No labels

44 Comments

  1. Anonymous

    ERROR: Failed to launch application on device: ERROR: Failed to install apk to device: pkg: /data/local/tmp/myAppOpenTok-debug-unaligned.apk
    Failure [INSTALL_FAILED_CPU_ABI_INCOMPATIBLE]
    ERROR: Failed to launch application on device: ERROR: Failed to install apk to device: pkg: /data/local/tmp/myAppOpenTok-debug-unaligned.apk

    Failure [INSTALL_FAILED_CPU_ABI_INCOMPATIBLE]

    Getting this error when trying to build on Android

    1. Could you please file an issue with more details on how to reproduce at http://youtrack.jetbrains.com/issues/IDEA?

  2. Anonymous


    I follow these steps but unfortunately , it doesn't work properly at run configuration,

    warring : cannot detect android sdk in path

     

     

    1. Do you have Android SDK installed properly? Are you able to run cordova emulate in the terminal?

    2. Anonymous

      Try adding path of android SDK adt-bundle\sdk\tools and adt-bundle\sdk\platform-tools to system variable

      1. Anonymous

        Worked! Thanks.

      2. Anonymous

        How to create a  path actually?

    3. Anonymous

      Tried to emulate for IOS platform but got an error. The error asked me to run the command with sudo (admin rights). How can I configure it inside IntelliJ? 

      1. Hi. You should open xcode and accept user agreement

    4. Anonymous

    5. Anonymous

      I have the same issue here. ionic run android runs from command line properly, but PATH variables are not available and cannot be configured in Web Storm IDE. This is really annoying that a phonegap tool does not support android debuging :/

  3. Anonymous

    how to configure 

    Configure the executable path

  4. Anonymous

    In an Ionic project the plugin picked up the cordova executable as /usr/local/bin/ionic and my working directory as /Users/Serge/projects/ionicTest. If I look at Languages&Frameworks > JavaScript > PhoneGap/Cordova it displays the version as 1.2.7 (completely wrong).I can do emulate, run or serve. With serve Ionic does livereload, but with run and emulate it doesn't out of the box, I can specify it using an extra parameter (--livereload), but there is no possibility to specify extra command line parameters.

    In Plugin management it reports:

           PhoneGap/Cordova version before 3.5 doesn't support plugin version management     

    Although my version is reported as 1.2.7 it still works to add plugins.

    In the plugin browser the amount of information is very minimal. Would be great if the readme of the git repository is shown, if the plugin has it.

    1. Didn't have possibility to login yesterday, but anonymous post above is mine. I hope I'm following this thread now.

  5. Anonymous

    I am trying step 2. Configure the executable path on Intellij 139.69.2 version and go the following error :

    NoSuchMethodError: com.intellij.webcore.packaging.PackagesNotificationPanel.(Lcom/intellij/openapi/project/Project;)V (show balloon)

    1. Please, update the plugin. New plugin version should fix the problem

  6. Anonymous

    Does it support debugging the plugin java code? I put a break point in the platform/android/src/com.xx.xx.XYZ.java code, it doesn't enable the break points.

  7. Anonymous

    Hi,

    I could able to generate .apk file in debug mode using intellij 14 version. Can anyone help me how to add custom images ?

    Regards,

    venkat

    1. Anonymous

      how do you generate it? I cant even get it emulate on avd. please guide

  8. Anonymous

    Where to add keystore file for generating apk in release mode?

  9. Anonymous

    how can i add something to "specify target" this box is empt and i cant choose anything ?

    1. The functionality is not available for phonegap (but should work for cordova and ionic). If you want to specify a android device the field must already contain list of android virtual devices. If you want specify a ios device you have to set value manual. See possible targets here: http://stackoverflow.com/a/22329264/1057218

  10. Anonymous

    Did anyone try to use it with ripple?

    I am getting the following error when I try to do it:

    Error running Cordova iOS:
    Cannot run program "node" (in directory "<path to my project>"): error=2, No such file or directory  

  11. Anonymous

    Could you add 'browser' to the list of platforms?

  12. Anonymous

    Could you add options support? Can't emulate with --livereload currently.

    Thanks.

  13. Anonymous

    All the directories are not coming after the configuration done. www folder is missing

  14. Anonymous

    Hi! I installed cordova via npm install -g, and whe I add to the executable path it throws me an error:

    Please correct path to PhoneGap/Cordova executable

    I have tried the following paths and none of them works:

    --> /home/username/.nvm/v0.10.35/lib/node_modules/cordova/bin/cordova

    --> /home/username/.nvm/v0.10.35/bin/cordova (symbolic link to the first)

    --> /usr/local/bin/cordova (symbolic link to the first)

    Thanks for your time! :)

    1. Anonymous

      I have the same exact problem. I've been using the Cordova CLI with another editor.  I then decided to try Webstorm and am impressed by it but can't get the past this path problem.  Using a Mac.

  15. Anonymous


    Is there anything wrong in my setup?

    1. Please reply to this account, I can run ionic run via command line too

    2. Anonymous

      I have this also, even though it is in my PATH and I can for instance run "android sdk" from command line, and I've used Android Studio and IntelliJ with it before...

      1. Anonymous

        Specifying PATH and/or ANDROID_HOME manually in configuration does not help either.

        1. Anonymous

          Or wait, doing that and closing the dialog and opening it again seems to have done the trick.. some fishy bug here.

          1. Anonymous

            Nope sorry. Just wrong target. Still an issue.

    3. Anonymous

      Have you solve it? Have the same error, and nearly same configuration.

  16. Anonymous

    while creating new cordova project .idea folder is not creating is that any issue or something else???

    1. This folder is created automatically by the IDE and contains IDE project configurations.

  17. Anonymous

    I completed first part and to configure the executable path for PhoneGap/Cordova/Ionic i cant find PhoneGap/Cordova plugin under the path given ( Settings → Languages and Frameworks →JavaScript → PhoneGap/Cordova). What should i do???

    1. Anonymous

      Ok i found it.I didn't installed phonegap using CLI i downloaded it separately. In this case how should i set path.I mean to which file.  

  18. Anonymous

    Hi Creator,

    Everything works fine! Thanks for creating this plugin.. But there is one thing I cannot find on the Internet, and I was hoping this plugin could provide some help.

    When I create Cordova plugins (android only for now), and include them, some java errors sometimes popup.. 

    So the question: Is there a way to show ADB android errors, somehow? 

    Many thanks!!

     

     

  19. Is there a way to enable code completion for Android plugins? 

  20. Anonymous

    is there a way to emulate with ripple emulator and not the device emulator in case of android because it obvioulsy takes more time to load

     

  21. Anonymous

    Is there a version for Idea 145.597?