目录

Contents

Dart 1 Web 应用迁移到 Dart 2

本文将向你阐述迁移 Dart 1.x Web 应用到 Dart 2 的相关信息。这些迁移变化是必须的因为:

This page has information on migrating your Dart 1.x web app to Dart 2. These changes are necessary because of the following:

你也可以查阅:Angular 迁移指南从 v4 到 v5

See also: Angular Migration Guide v4 to v5

工具

Tools

Dart 2 的 Web 应用开发环境与 Dart 1.x 不同。以下是重点:

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
Dartium, content shell Chrome 和 dartdevc
pub build webdev build
pub serve webdev serve
pub run angular_test pub run build_runner test -- -p chrome. See: Running tests
pub run angular_test pub run build_runner test -- -p chrome. See: Running tests
pub transformers build package transformers. See: Transforming code
pub transformers build package transformers. See: Transforming code

代码

Code

为了迁移到 Dart 2,你需要编辑你 Web 应用项目的一些文件:

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

你可以对比 4.xmaster 分支的任意 Angular 示例 应用来获取完整的迁移示例,比如这些:

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

Pubspec

修改你 pubspec.yaml 文件的这些部分:

Make these changes to your pubspec.yaml file:

  • Add new dev_dependencies:

  • dev_dependencies 添加新的节点:

    • build_runner:
    • build_test: ,如果你正在运行测试

      build_test: , if you are running tests

    • build_web_compilers:
  • 删除 dev_dependencies 中的下列节点:

    Drop dev_dependencies:

    • browser
    • dart_to_js_script_rewriter
  • 更新到 测试 版本 0.12.30 或更高;其会默认运行 Chrome 测试。

    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

例如,angular-examples/quickstart/pubspec.yaml 是一个应用了这些差异修改的示例。

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

带脚本元素的 HTML

HTML with script elements

web/index.html 文件是一个使用了 <script> 元素的最常见栗子。你需要作出以下修改:

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

  • 删除 <script defer src="packages/browser/dart.js"></script>

    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>

  • 替换为 <script defer src="foo.dart" type="application/dart"></script>
    <script defer src="foo.dart.js"></script>

angular-examples/quickstart/web/index.html 中向你展示了如何应用这些更改。

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

额外资源

Additional resources

  • Dart 2 更新:关于 Dart 2 的变更信息,以及如何从 Dart 1.x 迁移你的代码。

    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.