OLD | NEW |
(Empty) | |
| 1 Polymer.dart |
| 2 ============ |
| 3 |
| 4 Polymer.dart is a set of comprehensive UI and utility components |
| 5 for building web applications. |
| 6 With Polymer.dart's custom elements, templating, data binding, |
| 7 and other features, |
| 8 you can quickly build structured, encapsulated, client-side web apps. |
| 9 |
| 10 Polymer.dart is a Dart port of |
| 11 [Polymer][polymer] created and maintained by the Dart team. |
| 12 The Dart team is collaborating with the Polymer team to ensure that polymer.dart |
| 13 elements and polyfills are fully compatible with Polymer. |
| 14 |
| 15 Polymer.dart replaces Web UI, which has been deprecated. |
| 16 |
| 17 |
| 18 Learn More |
| 19 ---------- |
| 20 |
| 21 * The [Polymer.dart][home_page] homepage |
| 22 contains a list of features, project status, |
| 23 installation instructions, tips for upgrading from Web UI, |
| 24 and links to other documentation. |
| 25 |
| 26 * See our [TodoMVC][] example by opening up the Dart Editor's Welcome Page and |
| 27 selecting "TodoMVC". |
| 28 |
| 29 * For more information about Dart, see <http://www.dartlang.org/>. |
| 30 |
| 31 * When you use this package, |
| 32 you automatically get the |
| 33 [polymer_expressions][] package, |
| 34 which provides an expressive syntax for use with templates. |
| 35 |
| 36 |
| 37 Try It Now |
| 38 ----------- |
| 39 Add the polymer.dart package to your pubspec.yaml file: |
| 40 |
| 41 ```yaml |
| 42 dependencies: |
| 43 polymer: ">=0.16.0 <0.17.0" |
| 44 ``` |
| 45 |
| 46 Instead of using `any`, we recommend using version ranges to avoid getting your |
| 47 project broken on each release. Using a version range lets you upgrade your |
| 48 package at your own pace. You can find the latest version number at |
| 49 <https://pub.dartlang.org/packages/polymer>. |
| 50 |
| 51 |
| 52 Building and Deploying |
| 53 ---------------------- |
| 54 |
| 55 To build a deployable version of your app, add the polymer transformers to your |
| 56 pubspec.yaml file: |
| 57 |
| 58 ```yaml |
| 59 transformers: |
| 60 - polymer |
| 61 ``` |
| 62 |
| 63 Then, run `pub build`. The polymer transformers assume all files under `web` |
| 64 are possible entry points, this can be adjusted with arguments in your |
| 65 pubspec.yaml file. For example, you can say only `web/index.html` is an entry |
| 66 point as follows: |
| 67 |
| 68 ```yaml |
| 69 transformers: |
| 70 - polymer: |
| 71 entry_points: web/index.html |
| 72 ``` |
| 73 |
| 74 Here is a list of arguments used by the polymer transformers: |
| 75 * js: whether to load JS code directly. By default polymer converts your app's |
| 76 html file to load the compiled JS code directly. Setting this parameter to |
| 77 false will keep a dart script tag and the `dart.js` script tag on the page. |
| 78 |
| 79 * csp: whether to load a Content Security Policy (CSP) compliant JS file. |
| 80 Dart2js generates two JS files, one that is not CSP compilant and one that is. |
| 81 By default, polymer uses the former becuase it's likely more efficient, but |
| 82 you can choose the latter by setting this flag. |
| 83 |
| 84 * entry_points: can be a list of entry points or, for convenience, a single |
| 85 entry point as shown above. |
| 86 |
| 87 For example, this specification includes 2 entrypoints and chooses the CSP |
| 88 compliant JS file: |
| 89 |
| 90 ```yaml |
| 91 transformers: |
| 92 - polymer: |
| 93 entry_points: |
| 94 - web/index.html |
| 95 - web/index2.html |
| 96 csp: true |
| 97 ``` |
| 98 |
| 99 Testing |
| 100 ------- |
| 101 |
| 102 Polymer elements can be tested using either the original `unittest` or new `test
` packages. In both cases the easiest way to create a test is by using the defau
lt main from `polymer/init.dart` and then defining all your tests inside of a me
thod marked with an `@whenPolymerReady` annotation. |
| 103 |
| 104 ```dart |
| 105 import 'package:polymer/polymer.dart'; |
| 106 export 'package:polymer/init.dart'; |
| 107 |
| 108 @whenPolymerReady |
| 109 void runTests() { |
| 110 // Define your tests here. |
| 111 } |
| 112 ``` |
| 113 |
| 114 You will also need to define a custom html file for your test (see the README fo
r the testing package you are using for more information on this). |
| 115 |
| 116 **Note**: If you are using the new `test` package, it is important that you add
the `test` transformer after the polymer transformer, so it should look roughly
like this: |
| 117 |
| 118 ```yaml |
| 119 transformer: |
| 120 - polymer: |
| 121 entry_points: |
| 122 - test/my_test.html |
| 123 - test/pub_serve: |
| 124 $include: test/**_test{.*,}.dart |
| 125 ``` |
| 126 |
| 127 Contacting Us |
| 128 ------------- |
| 129 |
| 130 Please file issues in our [Issue Tracker][issues] or contact us on the |
| 131 [Dart Web UI mailing list][mailinglist]. |
| 132 |
| 133 We also have the [Web UI development list][devlist] for discussions about |
| 134 internals of the code, code reviews, etc. |
| 135 |
| 136 [wc]: http://dvcs.w3.org/hg/webcomponents/raw-file/tip/explainer/index.html |
| 137 [pub]: http://www.dartlang.org/docs/pub-package-manager/ |
| 138 [cs]: http://www.chromium.org/developers/testing/webkit-layout-tests |
| 139 [cs_lucid]: http://gsdview.appspot.com/dartium-archive/continuous/drt-lucid64.zi
p |
| 140 [cs_mac]: http://gsdview.appspot.com/dartium-archive/continuous/drt-mac.zip |
| 141 [cs_win]: http://gsdview.appspot.com/dartium-archive/continuous/drt-win.zip |
| 142 [dartium_src]: http://code.google.com/p/dart/wiki/BuildingDartium |
| 143 [TodoMVC]: http://todomvc.com/ |
| 144 [issues]: https://github.com/dart-lang/polymer-dart/issues/new |
| 145 [mailinglist]: https://groups.google.com/a/dartlang.org/forum/?fromgroups#!forum
/web-ui |
| 146 [devlist]: https://groups.google.com/a/dartlang.org/forum/?fromgroups#!forum/web
-ui-dev |
| 147 [overview]: http://www.dartlang.org/articles/dart-web-components/ |
| 148 [tools]: https://www.dartlang.org/articles/dart-web-components/tools.html |
| 149 [spec]: https://www.dartlang.org/articles/dart-web-components/spec.html |
| 150 [features]: https://www.dartlang.org/articles/dart-web-components/summary.html |
| 151 [home_page]: https://www.dartlang.org/polymer-dart/ |
| 152 [polymer_expressions]: http://pub.dartlang.org/packages/polymer_expressions |
| 153 [polymer]: http://www.polymer-project.org/ |
OLD | NEW |