PhoneGap, Cordova, and Ionic

1. Install and enable the PhoneGap/Cordova plugin on the Plugins page as described in Installing plugins from repository.

2. Make sure you have Node.js on your computer.

3. Download and install an emulator tool depending on the target platform and the operating system you use. Learn more from the Cordova official website.

4. To emulate the iOS platform, install the ios-sim and ios-deploy command-line tools globally.

   Open the embedded Terminal (Alt+F12) and type:

   npm install -g ios-sim

   npm install -g ios-deploy

In the embedded Terminal (Alt+F12), type one of the following commands:

• npm install -g phonegap@latest

  Learn more from the PhoneGap official website.

• npm install -g cordova

  Learn more from the Cordova official website.

• npm install -g @ionic/cli

  Learn more from the IonicCLI official website.

Create an application from a template

1. Click Create New Project on the Welcome screen or select File | New | Project from the main menu. The New Project dialog opens.

2. In the left-hand pane, choose Cordova App.

3. In the right-hand pane, specify the path to the folder where the project-related files will be stored. Specify the location of the executable file. Depending on your operating system and target platform, this can be phonegap, phonegap.cmd, cordova, cordova.cmd, ionic, or ionic.cmd.

4. When you click Create, RubyMine generates a skeleton of an application with the framework-specific structure.

Configure PhoneGap, Cordova, or Ionic in your project

1. Open the Settings/Preferences dialog Ctrl+Alt+S and go to Languages and Frameworks | JavaScript | Cordova.

2. Check the location of the executable file or specify the path to it if RubyMine has not detected the executable automatically. This can be phonegap, phonegap.cmd, cordova , cordova.cmd, ionic, or ionic.cmd, depending on your operating system and the selected framework.

   RubyMine detects the installed version and displays it in the Cordova version read-only field.

3. In the Cordova working directory field, specify the folder where the application files to run are stored.

4. By default, RubyMine automatically treats the platforms or www directory as excluded and ignores it during indexing, parsing, and code completion, see Configuring folders in a content root.

   To preserve this default behavior, make sure the Automatically exclude working directories ('platforms', 'www' for ionic) checkbox is selected.

Create a run configuration

1. From the main menu, choose Run | Edit Configurations. In the Edit Configuration dialog that opens, click on the toolbar and choose PhoneGap/Cordova from the context menu.

2. In the Run/Debug Configuration: PhoneGap/Cordova dialog that opens, specify the following:

   1. The name of the configuration.

   2. In the Cordova executable field, specify the location of the executable file phonegap, phonegap.cmd, cordova , cordova.cmd, ionic, or ionic.cmd, depending on your operating system and the selected framework.

   3. In the Cordova working directory field, specify the folder where the application files to run are stored.

   4. From the Command list, choose the command to run. The contents of the list, depend on the actually used framework, namely, on the executable file specified in the Cordova executable field. The available options are:

      • For PhoneGap:

        • emulate

        • run

        • prepare

        • serve

        • remote build

        • remote run

        See PhoneGap CLI for a list of PhoneGap-specific commands with descriptions.

      • For Cordova:

        • emulate

        • run

        • prepare

        • serve

        See Cordova CLI for a list of Cordova-specific commands with descriptions.

      • For Ionic:

        • emulate

        • run

        • prepare

        • serve

        See Ionic CLI for a list of Ionic-specific commands with descriptions.

   5. From the Platform list, choose the platform for which the application is intended.

      The available options are:

      • Android

      • iOS
        To emulate this platform, install the ios-sim and ios-deploy command-line tools globally.

        Open the embedded Terminal (Alt+F12) and type:

        npm install -g ios-sim

        npm install -g ios-deploy

      • browser
      • amazon-fireos
      • firefoxos
      • blackberry10
      • ubuntu
      • wp8
      • windows
      • windows8

      Learn more about targeted platforms from the Platform Guides.

   6. For Cordova and Ionic, specify the targeted virtual or physical Android device to run the application on: select the Specify Target checkbox and select the required device from the list.

      The list shows all the virtual and physical devices that are currently configured on your machine. Learn more about setting up emulators from the Cordova official website.

      If RubyMine displays the following error message: Cannot detect ios-sim in path, make sure you have installed the ios-sim, see Before you start.

Run an application

• Select the newly created run configuration from the list on the main toolbar and click next to the list.