Page tree
Skip to end of metadata
Go to start of metadata

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:

Creating a new Dart project

To create a new Dart project, click Create New Project on the IDE Welcome screen and select Dart from the project types on the left.

You’ll be prompted to specify the values for the Dart SDK path and Dartium path (optional). 

Working with an existing Dart 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.

Then proceed with enabling Dart support and configuration.

Configuring Dart SDK and Dartium

To start using Dart in WebStorm, you need to specify the path to the Dart SDK.

The configuration dialog is available in SettingsLanguages & FrameworksDart:

Edit the path to the SDK location on your machine. You can download the latest Dart SDK from
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.

Managing packages and assets

To manage Dart packages and assets required for the project, use pub ( 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 SettingsProjectDirectories.

Open in Dartium

To preview your project in Dartium:

  • Select Open in BrowserDartium 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.

Run app in another browser

To run your application in another browser, select Open in Browseryour browser from the context menu of your project html file. WebStorm will automatically run Dart's pub serve command and open a browser with your app running.

Debugging Dart web apps

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 SettingsLanguages & FrameworksDart.

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:

You can debug your Dart code the same as JavaScript code: put breakpoints, check variables, and execute your code step by step:

Running and debugging Dart command-line apps

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.

Testing with DartUnit

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.

  • No labels