Setting up a new Angular project is quick and easy, using everyday Dart tools.
The examples in this guide and tutorial are based on
the Simple Angular Example.
This page leads you through getting the files for this example,
using either a Dart-savvy IDE such as WebStorm
or the command-line tool
Prerequisites: Dart SDK & Dartium
If you don't already have the Dart SDK and Dartium, get them. We recommend using the WebStorm IDE, as well.
Get Started tells you how to get the tools.
Using WebStorm to create a project
Using WebStorm to create an app is simple, once you complete some one-time setup.
- Launch WebStorm.
- If you haven't already done so, configure Dart support in WebStorm.
- Choose Create New Project from the welcome screen, or File > New > Project... from the menu. A dialog appears.
- Select Dart from the list on the left.
- Set the location and template:
- In the Location input field, check that the project folder is where you want it.
- Also in the Location field,
change the name of the project from
untitledto whatever you choose, such as
- Make sure that Generate sample content is checked.
- Select Simple Angular Example from the list.
The form should look similar to the following:
- Click Create.
WebStorm takes several seconds to analyze the sources and do other housekeeping. This only happens once. After that, you'll be able to use WebStorm for the usual IDE tasks, including running the app.
If WebStorm shows errors for the app, it probably didn't get the dependencies for your app.
To fix the problem,
pubspec.yaml and choose Pub: Get Dependencies.
For more information on using WebStorm, see Installing and Using WebStorm.
Using Stagehand to create a project
Stagehand gives you
command-line access to the same templates that WebStorm uses.
Assuming the Dart SDK and
are in your path, here's how you use Stagehand to create an Angular project.
- Install or update stagehand:
pub global activate stagehand
- Create a directory for your project:
mkdir example1; cd example1
- Use Stagehand with the simple Angular template to create a skeleton app:
- Get the app's dependencies:
Running the app
To run the app from WebStorm, right-click the app’s
web/index.html file and choose Run ‘index.html’.
The app appears in a Dartium browser window.
To run the app from the command line, use the
pub serve command
to start the Dart compiler and an HTTP server.
Then, to view your app, use a browser to navigate to
the URL that
pub serve displays.
As you update the code Pub detects the change and serves the new app. Reload the browser window to see your changes.