Dart

Install and enable the Dart repository plugin on the Plugins page as described in Managing plugins.

Download and install the Dart SDK.

The Dart SDK contains all the tools for developing both command-line and web Dart applications. It incorporates the Dart Virtual Machine, the Dart Libraries, as well as all the command line tools, including compilers (dart2js and dartdevc) and the pub tool.

To create a Dart project from a Stagehand template

1. Select File | New | Project from the main menu or click Create New Project on the Welcome screen. The Create New Project Dialog opens.

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

3. In the right-hand pane, specify the path to the folder where the project-related files will be stored.

4. Specify the path to the Dart SDK. PhpStorm detects and displays the Dart version.

5. To have a sample application created in the project, select the Generate sample content checkbox and choose the relevant Stagehand template from the list below. If you clear the checkbox, PhpStorm creates an empty project.

   

6. Click Create. PhpStorm sets up the project structure and generates some sources based on the selected Stagehand template.

To create an empty PhpStorm project

1. Select File | New | Project from the main menu or click Create New Project on the Welcome screen. The Create New Project Dialog opens.

2. In the left-hand pane, choose PHP Empty Project. In the right-hand pane, specify the application folder and click Create.

To open the application sources that are already on your machine

Click Open on the Welcome screen or select File | Open Directory from the main menu. In the dialog that opens, select the folder where your sources are stored.

To check out the application sources from your version control

1. Click Check out from Version Control on the Welcome screen or select VCS | Check out from Version Control from the main menu.

2. Select your version control system from the list.

3. In the VCS-specific dialog that opens, type your credentials and the repository to check out the application sources from.

To configure Dart support in an existing project

1. In Settings/Preferences dialog (Ctrl+Alt+S), choose Dart under Languages and Frameworks. The Dart page opens.

2. Select the Enable Dart support for the project <project name> checkbox.

3. In the Dart SDK Path field, specify the location of the downloaded Dart SDK. Type the path manually or click and choose the path in the dialog box that opens. If PhpStorm recognizes the Dart SDK correctly, its revision number is displayed in the Version read-only field.

To add a Dart project (package) to an existing PhpStorm project

1. In the Settings/Preferences dialog (Ctrl+Alt+S), go to Directories. The Directories page opens.

2. In the right-hand pane with a list of existing content roots, click Add Content Root. Then in the dialog that opens, choose the root folder of the Dart project (package) to be attached.

1. Open the pubspec.yaml file in the editor or switch to the tab where it is opened.

2. On the pane at the top of the tab, click Build. This invokes the webdev build action.

3. In the dialog that opens, specify the input folder to take the sources from and the output folder where you want the compiled application stored.

To run a Dart command-line application

1. Open the Dart file to start the application from or select it in the Project Tool Window. This file must contain a main() method.

2. From the context menu of the selection, choose Run '<dart_file_name>'. PhpStorm generates a run/debug configuration of the type Dart Command Line App and launches your application with it.

To debug a Dart command-line application locally

1. Configure and set breakpoints in the Dart code.

2. Open the Dart file to start the application from or select it in the Project Tool Window. This file must contain a main() method.

3. From the context menu of the selection, choose Debug '<dart_file_name>'. PhpStorm generates a run/debug configuration of the type Dart Command Line App and starts a debugging session with it.

4. In the Debug Tool Window that opens, step through the program, stop and resume program execution, examine it when suspended, and so on.

To create a Dart Remote Debug run/debug configuration

1. On the main menu, choose Run | Edit Configurations, click and choose Dart Remote Debug from the list. The Run/Debug Configuration: Dart Remote Debug opens.

2. In the Host field, specify the address of the computer where the Dart Virtual Machine is running, the default value is localhost.

3. Specify the port through which the debugger will connect to the remote application, the default value is 5858. The specified port is shown in the Use the command line arguments when starting the remote VM read-only field. Note that a remote application must be started exactly with these arguments.

4. From the Search Sources in list, choose the Dart project to debug if your PhpStorm project contains several Dart projects configured as content roots.

To launch a remote debugging session

1. Start a remote Dart application with the VM options from the Command line arguments for the remote Dart VM field in the Dart Remote Debug run configuration, for example, --enable-vm-service:5858 --pause_isolates_on_start. The application starts, immediately suspends thanks to the --pause_isolates_on_start argument, and waits for the debugger to connect.

2. Choose the newly created Dart Remote Debug configuration in the Select run/debug configuration list and click .

3. In the Debug Tool Window that opens, step through the program, stop and resume program execution, examine it when suspended, and so on.

To run a Dart web application

1. Open the HTML file with a Dart reference or select it in the Project Tool Window.

2. From the context menu of the editor or selection, select Open in Browser and choose the required browser in the list.

To create a JavaScript Debug run/debug configuration

1. Open the HTML file that references Dart or select the file in the Project Tool Window.

2. From the context menu, select Create '<HTML_file_name>'. The Run/Debug Configuration: JavaScript Debug dialog opens.

3. Specify the browser to debug the application in.

   • With Dart SDK 2, you can use only Chrome and the Dart code is compiled into JavaScript through the dart2js or dartdevc tool.

   • With Dart SDK 1.x, you can use Dartium, which has a built-in Dart virtual machine, so the Dart code is executed natively.

     To use Dartium, download and configure it as described in Configuring Browsers. Make sure the browser name either is Dartium or at least contains Dartium as its part.

4. The URL field already shows the URL address of the application in the format http://localhost:<built-in server port>/<project-name>/<relative path to the HTML file>. During a debugging session, the browser will be redirected from this URL to the webdev server URL.

To start debugging

1. Configure and set breakpoints in the Dart code.

2. Initiate a debugging session: choose the created run configuration from the Edit configurations list on the toolbar and click . PhpStorm opens the specified URL in the chosen browser.

3. In the Debug Tool Window that opens, step through the program, stop and resume program execution, examine it when suspended, and so on.

To run or debug a single test

Open the test file in the editor, right-click the call of the test() method, and choose Run '<test_name>' or Debug '<test_name>' from the context menu.

To run or debug a group

Open the test file in the editor, right-click the call of the group() method, and choose Run '<group_name>' or Debug '<group_name>' from the context menu.

To run or debug Dart tests from a file

In the Project Tool Window, select the file with the tests to run and choose Run '<file_name>' or Debug '<file_name>' from the context menu.

To run or debug Dart tests from a folder

In the Project Tool Window, select the folder with the tests to run and choose Run '<folder_name>' or Debug '<folder_name>' from the context menu.

To save an automatically generated default configuration

After a test session is over, choose Save <default_test_configuration_name> from the context menu of the test, test group, test file, or folder.

To run or debug tests using a previously saved run/debug configuration

Choose the required Dart Test configuration from the list on the toolbar and click or .