Dart Package Management via dart2js

Question

I'm learning Dart and its dependency manager pub and am having a tough time seeing the "forest through the trees" here.

Say I want to use Polymer.dart in my project. So, in my project root, I create the following pubspec.yaml:

name: test_dart
description: A sample web application
dependencies:
    browser: any
    polymer: ">=0.9.0 <0.10.0"

I then run pub get, which goes to the pub repo and fetches the browser and polymer dependencies that I've specified. It then creates a packages directory in my project root, which now means I have a project that looks like:

MyDartProject/
    pubspec.yaml
    myapp.dart
    packages/
        browser/
            ...
        ...all the packages that ship with Polymer

Now I start coding my Dart web app (myapp.dart), which will references various Polymer and browser types/functions/etc. in its source code.

When I'm all done, I want to create a JavaScript file called myapp.js.

According to the dart2js docs, I need to run something like:

dart2js --out=myapp.js --package-root=??? myapp.dart

How do I include all the browser & polymer packages on the buildpath?

score 4 · Accepted Answer · answered Dec 21 '13 at 12:31

4

There is a "pub build" option now.

http://pub.dartlang.org/doc/pub-build.html

Use pub build when you’re ready to deploy your web app. When you run pub build, it generates the assets for the current package and all of its dependencies, putting them into a new directory named build.

$ cd ~/dart/helloworld
$ pub build
Building helloworld......
Built 5 files!

If the build directory already exists, pub build deletes it and then creates it again.

That should do everything you are after here. You can also launch it from the IDE by right clicking on the pubspec.yaml file and choose "pub build"

EDIT: You should also see the links in zoechi's answer.

answered Dec 21 '13 at 12:31

Paul Collingwood

9,053
3
23
36

Thanks @Paul Collingwood (+1) - quick followup for you. I am in the Dart Editor and just ran `Pub Build` on the `sunflower` app that ships with the editors as a sample app. It created a `build` directory in my project root that contains several items: a `packages` directory, `math.png`, `sunflower.css`, `sunflower.dart.js` and `sunflower.html`. **What do I put on the web server?** Do I need to put everything on the server, or can I leave off the `packages` directory? (Or does `sunflower.dart.js` reference compiled code in `packages`, making it necessary to be on the server)? Thanks again! – IAmYourFaja Dec 21 '13 at 12:48
2

put everything in build on the server. It's self-contained. Content in the packages directory will still be referred to so you need that too. – Paul Collingwood Dec 21 '13 at 12:50

score 1 · Answer 2 · edited May 23 '17 at 11:50

1

If you run dart2js from your MyDartProject directory you don't have to provide --package-root parameter.

An alternative way is running pub build. If you use Polymer you need to add a transformers section.

see also

edited May 23 '17 at 11:50

Community

1
1

answered Dec 21 '13 at 12:31

Günter Zöchbauer

623,577
216
2,003
1,567

Awesome answer and links @zoechi (+1) - please see my comment underneath Paul Collingwood's answer - I have the same question for you! – IAmYourFaja Dec 21 '13 at 12:49
Also @zoechi what are *transformers*?!? I don't see them listed in the [`pubspec` specification](http://pub.dartlang.org/doc/pubspec.html). Thanks again! – IAmYourFaja Dec 21 '13 at 13:12
1

Transformers are programs that can be integrated in the build process (you could write your own in Dart and add it using pubspec.yaml). The Polymer transformers do the Polymer-specific part of the transformation from Dart to JS (not sure myself what steps exactly are included here). [sass](http://pub.dartlang.org/packages/sass) is another example which initiates SASS to convert SASS source files to CSS files. – Günter Zöchbauer Dec 21 '13 at 13:29
1

Transformers are quite new and not yet mentioned in the doc. – Günter Zöchbauer Dec 21 '13 at 15:17

Dart Package Management via dart2js

2 Answers2

Linked