Polymer.dart 1.0.0-rcx 需要哪些导入和脚本标签

Question

使用 Polymer.dart 的客户端应用程序需要哪些导入和脚本标签才能正常工作？

Answer 1

<!DOCTYPE html>
  <head>
    <script src="packages/web_components/webcomponents-lite.min.js"></script>
    <script src="packages/browser/dart.js"></script>
  </head>
  <body unresolved>
    <my-element></my-element>
    <script type="application/dart" src="index.dart"></script>
  </body>
</html>

webcomponents-lite.min.js 脚本添加了 Polymer polyfill。
每个 Dart 浏览器应用程序都需要 dart.js 才能在没有 Dart VM 的浏览器中运行。
index.dart 包含您的自定义 main(); 并使用 @HtmlImports(...)

<my-element>

其中 index.dart 包含

import 'package:polymer/polymer.dart';
import 'my_element.dart';

/// Silence analyzer [MyElement]
main() async {
  await initPolymer();
}

没有自定义 main

使用 <link rel="import" ...> 导入元素（不鼓励）

<!DOCTYPE html>
  <head>
    <script src="packages/web_components/webcomponents-lite.min.js"></script>
    <link rel="import" href="my_element.html">
  </head>
  <body unresolved>
    <my-element></my-element>
    <script type="application/dart">export 'package:polymer/init.dart';</script>
    <script src="packages/browser/dart.js"></script>
  </body>
</html>

或使用 @HtmlImport(...) 导入元素

<!DOCTYPE html>
  <head>
    <script src="packages/web_components/webcomponents-lite.min.js"></script>
  </head>
  <body unresolved>
    <my-element></my-element>
    <script type="application/dart">
      export 'package:polymer/init.dart';
      import 'my_element.dart';
    </script>
    <script src="packages/browser/dart.js"></script>
  </body>
</html>

提示： 如果没有 main 的显式脚本标记，则很难为可反射转换器注册入口点。可以使用生成文件的某个名称代替，但我还不知道这个文件名是什么。

Polymer.dart 1.0.0-rcx 需要哪些导入和脚本标签

What imports and script tags are required for Polymer.dart 1.0.0-rcx

dart

dart-polymer