Dart 2 Migration Guide for Web Apps


This page will guide you through migrating your Dart 1.x web app to Dart 2. These changes are necessary because of the following:

Tools

The development environment for web apps is different in Dart 2 from Dart 1.x. Here are the highlights:

Dart 1.x Dart 2
Dartium, content shell Chrome and dartdevc
pub build webdev build
pub serve webdev serve
pub run angular_test pub run build_runner test -- -p chrome. See: Running tests
pub transformers build package transformers. See: Transforming code

Code

To migrate to Dart 2, you’ll need to edit your web app’s project files:

For complete examples of migrated apps, compare the master and 5-dev branches of any one of the angular-examples apps, such as these:

Pubspec

Make these changes to your pubspec.yaml file:

  • Add new dev_dependencies:
    • build_runner: ^0.9.0
    • build_test: ^0.10.2, if you are running tests
    • build_web_compilers: ^0.4.0
  • Drop dev_dependencies:
    • browser
    • dart_to_js_script_rewriter
  • Upgrade to test version 0.12.30 or later; it runs Chrome tests headless by default.
  • Drop all transformers:
    • angular
    • dart_to_js_script_rewriter
    • test/pub_serve

For example, here is a diff of angular-examples/quickstart/pubspec.yaml with these changes applied.

HTML with script elements

The most common example of a file with <script> elements is web/index.html. You’ll need to make these changes:

  • Drop <script defer src="packages/browser/dart.js"></script>
  • Replace <script defer src="foo.dart" type="application/dart"></script> by
    <script defer src="foo.dart.js"></script>

Here is a diff of angular-examples/quickstart/web/index.html with these changes applied.

Additional resources

  • Dart 2 Updates: Information about changes in Dart 2, and how to migrate your code from Dart 1.x.
  • Changelog: Lists changes made to this site’s documentation and examples.