|This is a getting started guide for developing with Dart language in WebStorm. Dart plugin is also available in IntelliJ IDEA Community and IntelliJ IDEA Ultimate, PhpStorm, PyCharm and RubyMine.|
Dart built-in support in WebStorm includes:
- Coding assistance for Dart: autocompletion, validation, quick-fixes, powerful navigation, refactoring
- Pub integration
- Quick preview in Dartium for Web apps
- Full-featured debugging in Dartium
- Debugging Dart command line apps
- Unit testing for Dart apps
In this tutorial:
To create a new Dart project, click Create New Project on the IDE Welcome screen and select ‘Dart Application’ from the drop-down list.
You’ll be prompted to configure Dart support for this project.
To open an existing Dart project, click Open Directory on the IDE Welcome screen. Alternatively, if your project is stored in GitHub, git, or another VCS, cliсk Check out from Version Control. The New Project wizard (New Project from Existing Files) will help you configure a new project when working from a remote server or FTP deployment.
Then proceed with enabling Dart support and configuration.
To start using Dart in WebStorm, you need to specify the path to the Dart SDK.
The configuration dialog is available in Settings | Dart:
or while you create a new project.
Edit the path to the SDK location on your machine. You can download the latest Dart SDK from http://dartlang.org.
If the SDK was downloaded together with Dart Editor, the path to Dartium is added automatically. You can configure command-line options and a custom user data directory for Dartium by clicking Settings.
To manage Dart packages and assets required for the project, use pub (http://pub.dartlang.org/). Pub actions get, update and build are available from the context menu of your project’s pubspec.yaml file:
Note that copies of the packages folder are automatically excluded from the project. Only the root packages folder (next to pubspec.yaml file) remains visible. To see the excluded directories, go to Settings | Directories.
To preview your project in Dartium:
- Select Open in Browser | Dartium from the context menu of your project html file:
- OR, click the Dartium icon at the top righthand corner in the editor:
The browser will start and the page will open.
Dart code can be executed only in Dartium browser. Make sure that Dartium with the JetBrains IDE Support extension is installed and set up in Settings | Dart.
Select Debug file from the context menu of your html file which references the Dart file you want to debug. WebStorm will automatically start the debugging session with Dartium:
To run Dart command line applications, click Run in the context menu of the file you’d like to execute:
Set breakpoint and click Debug to start a new debugging session for Dart command line application.
To run DartUnit tests, you need to create and then run a new Run configuration. In the context menu of the test file, select Create run configuration and then select Test:
You can run this configuration from the test file context menu. Alternatively, select this new configuration at the top righthand corner of the IDE window and click Run.