Phpstorm Ionic



Skip to end of metadataGo to start of metadata

  1. Phpstorm Incoming Connection From Xdebug
  2. Phpstorm Ionic Pro
  3. Phpstorm Icons
  4. Phpstorm Ionic Login

Optimize the website with the latest tools. Generate an Ionic App locally. Test the App directly on your Android phone. Design the App using the Creator tool. Import your designed App to your local build. Code the App to fetch data from the website and display it. Build a signed production version of the App.

Core. File SystemPerformanceIDEA-216453UI freeze after branch switch caused by file type detection from content (via TemplateDataLanguagePusher)
Core. IDE SettingsBugIDEA-210503Freeze when trying to update IDE from 'Settings' dialog
Core. IndicesBugIDEA-218036`java.lang.IllegalStateException: psiFile is null` ERROR causes editor to break in various ways
Core. Platform APIFeatureIDEA-214797Allow using color palette in themes
BugIDEA-210479A race condition in module structure loading
BugIDEA-204092ExternalSystemApiUtil#findProjectTasks not static
Core. Run | Debug. ConfigurationsBugIDEA-210897Not possible to paste the value containing equals sign in the environment variables
BugIDEA-206657Compound Run Configuration triggers 'Run' but not 'Debug'
EditorBugIDEA-211720Make brace highlighting consistent with move to matching brace action behavior
Editor. Code CompletionFeatureIDEA-199722Can I make the live template appear at the top of the code completion list?
BugIDEA-214469Live Templates suggestions disappear on non-alphanumeric character input
Editor. Editing TextPerformanceIDEA-216728IDE freezes when editing files
PerformanceIDEA-211672Editing of big file with search result Live Preview on is quadratically slow
CosmeticsIDEA-218125Select all occurrences doesn't release highlight on blur
Editor. Formatter and Code StyleBugIDEA-214727Unexpected code style modifications on scheme switch
Infrastructure. Packaging and InstallationBugIDEA-200887'Failed to load JVM DLL' on a fresh copy of Windows 10
Plugin. MarkdownBugIDEA-213128UI not responding after opening markdown file
User InterfaceBugIDEA-212737Borderless UI: Project name keeps the default font on changing appearance font
BugIDEA-212346Scrollbar does not reflect the size of the content in Version Control tab while resizing it
User Interface. ControlsBugIDEA-125108Alphabetical sorting in File Structure doesn't persist after closing
User Interface. FocusBugIDEA-189984Can't type in detached editor tab on Mac
BugIDEA-215107The cursor is gone after 'Find in Path..' dialog
User Interface. Keyboard InputBugIDEA-203286Paste From History appends paste history number to pasted content.
BugIDEA-187355µ, when extracting method
User Interface. NavigationBugIDEA-214915Home and end keys don't work in floating navigation bar
Version Control. GitPerformanceIDEA-218198UI hanging due to Git filesystem access on main event queue thread (GitRootConverter.convertRoots)
DB IntrospectionExceptionDBE-8577MS SQL: attempts to introspect inaccessible database causes exceptions like[S0001][916] The server principal… is not able to access the database… under the current security context
Data ViewsBugDBE-7701While creating a new row, any boolean column with a default value set cannot be editted before the row is comitted to the database
BugDBE-8453Can not open table editor for Apache Ignite database: Failed to parse query. Table 'UCP' not found
UsabilityDBE-8318Filter History no longer showing up after 2019.1 release
SQL GeneralBugDBE-8499DataGrip UI hangs when (or right after) introspecting Oracle DB.
No subsystemBugWEB-38850A second space character is added after typing a space while entering a `return` keyword
Build toolsBugWEB-39808Freezes in JsbtFileManager$MyVirtualFileListener.beforeFileDeletion
CoffeeScriptBugWEB-38714)<0 sequence breaks coffeescript code colouring
BugWEB-36037CoffeeScript Syntax Error: Unmatched closing ')' -- when it is actually present
BugWEB-39059CoffeScript, JSX: Coffeescript plugin is disabled on adding/removing braces in attribute value
JavaScript. FrameworksFeatureWEB-36042HTML attributes and tags used as slot name for transclusion reported as illegal
FeatureWEB-39351Add support for ngNonBindable directive
FeatureWEB-38855Angular @Attribute decorator not recognized
BugWEB-39128Angular: no support for 'spread' expression in metadata.
BugWEB-39722Unrecognized Ionic/Angular attributes
BugWEB-39460Angular: loading angular.json is broken if there are `input` sections in it
BugWEB-39587Angular - failed to load schematics exception
BugWEB-38781Angular - select attribute not recognized for ng-content
PerformanceWEB-39115Angular: slow code completion on large projects
PerformanceWEB-39085Editing HTML in Angular is slow
ExceptionWEB-39906PsiInvalidElementAccessException in Angular project
TypeScriptBugWEB-39538Webstorm 2019.01 Fails to provide type hints with complex generics, conditional generics and wrappers in Angular Templates

PhoneGap and Apache Cordova are frameworks for developing mobile application with single HTML, CSS, and JavaScript/TypeScript code base and targeting various mobile platforms, including Android.

PHPStorm: It is an IDE that is developed for PHP and Web Developers that contains several modern tools. It also offers features such as functionality, Code navigation, smart code editor for PHP, Testing and Debugging facilities. Apart from these, the presence of Database technologies is an interesting aspect of PHPStorm. In PhpStorm, the entire nodemodules directory is excluded, but not specifically the @ionic/angular. Note, references to other modules are working fine. Edit 2: Here's how the folder coloring shows up: @ionic/angular doesn't work. @ionic-native/core works.

Before you start

  1. Install and enable the PhoneGap/Cordova plugin on the Settings/Preferences | Plugins page as described in Installing plugins from JetBrains 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

Installing PhoneGap and Cordova

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

IonicPhpstorm editor
  • npm install -g phonegap@latest

    Learn more from the PhoneGap official website.

  • npm install -g cordova

    Learn more from the Cordova official website.

You can also install your package on the Node.js and NPM page as described in npm, pnpm, and Yarn.

Creating a new PhoneGap or Cordova application

If you have no application yet, you can generate a PhpStorm project with PhoneGap or Cordova-specific structure from a boilerplate template. Alternatively, create an empty PhpStorm project and configure PhoneGap or Cordova support in it.

Bricscad vs zwcad

Phpstorm Incoming Connection From Xdebug

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 Create New Project Dialog opens.

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

    Select Cordova even if you are going to develop a PhoneGap or an iOS application, because these frameworks use quite similar app generators.

  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, or cordova.cmd.

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

Starting with an existing PhoneGap or Cordova application

To continue developing an existing application, open it in PhpStorm, download the required dependencies, and configure PhoneGap or Cordova support in your project.

Configure PhoneGap or Cordova 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 PhpStorm has not detected the executable automatically. This can be phonegap, phonegap.cmd, cordova , or cordova.cmd, depending on your operating system and the selected framework.

    PhpStorm 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, PhpStorm 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.

Running PhoneGap and Cordova applications

PhoneGap and Cordova applications are executed according to a dedicated run/debug configuration.

Phpstorm Ionic Pro

Create a run configuration

Phpstorm Icons

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

  2. In the Run/Debug Configuration: 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 or cordova.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.

    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

        Cisco anyconnect secure mobility client 4.8 download

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

      Learn more about targeted platforms from the Platform Guides.

    6. For Cordova, 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 PhpStorm 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

Phpstorm Ionic Login

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