I have an angular dart application with a component using canvas via a shadowroot. This runs fine with Dartium, "run as javascript" and pub serve. However when I run pub build and launch the html file in build/web, the component does not appear. The code is at
https://github.com/siddhartha-gadgil/mathlets
Should I be using some special transformers, or do something different to build as against serve?
I tried your project and it appears to be working fine.
What I have done in the past is run pub build and hit the built file in dartium and that will not work. So you have to hit the build file from chrome proper. So if I load .../mathlets/build/web/mathlets.html in chrome it works fine.
The reason for this is because pub build is the release build, which does not copy any of the dart files. However the index file still has the check if dart is enabled than try to use dart files. Well in dartium dart is enabled but the build doesn't have the dart files. In chrome dart is not enabled so then that 'packages/browser/dart.js' file dynamically writes the mathletes.dart.js to index and launches the app that way.
If you want to work around this and improve performance of the release build at the same time you can use this transformer: http://pub.dartlang.org/packages/dart_to_js_script_rewriter
We are using this also. Ensure it's the last transformer run though, if it's before the angular transformer there are problems.
Related
I am very new to Dart so bear with me. I completed the sample pirate badge project and did Pub Build - Minified as instructed. The generated build folder does not contain the packages/browser/dart.js and priatebadge.dart files that are referenced by piratebadge.html.
When I view in the browser there are errors related to those missing files. If I change the html page to reference the generated piratebadge.dart.js file it works.
Is this manual change something that has to be done with dart projects? or am I missing something in the build process?
At first, ensure you build in release mode. (default if you run pub build from command line.
I haven't checked for a while but I assume there is still this Dart script tag which was introduced when it was still planned to integrate Dart into Chrome. This will hopefully fixed soon. In the meantime you can fix this manually or use https://pub.dartlang.org/packages/dart_to_js_script_rewriter to automate this step.
I am trying to compile Spark IDE for chrome apps from https://github.com/dart-lang/spark/tree/master/ide. Steps
Opened chrome://flags and enabled experimental api
Opened chrome://extensions and "Load unpacked extension" pointed to the local folder for the above code.
The app loads. On loading it is stuck with a loading animation forever
For running in Dartium you need to point to the app directory not the package directory.
You also need to run grind setup to copy the application to the app directory as the readme here says https://github.com/dart-lang/spark/tree/master/ide
I'm not sure this experimental settings are still necessary (probably not if you use a Dart development build which already includes Dartium 36)
For building to JavaScript you run pub build in the package directory and load the extension from build/web/app (normally it is done this way, not sure if this really works with Spark, haven't tried it myself yet)
With the SDK 1.3, when I use pub build in Dart Editor, it generate a lot of files isntead of a one minify file. If I use pub in console with --mode=release, it make only a file.
How I set default mode in Dart Editor?
Somehow, executing pub build through Dart editor will run on debug mode. So far, my work around is to run it though command line.
This is an open issue, although there seems to be no plan regarding this yet.
New
DartEditor now has two distinct menu items for debug and release mode.
Original
I'm not sure what you are asking for. As far as I know --mode=release is default for pub build.
I also don't get only one file with pub build --mode=release.
You can try to add this to your pubspec.yaml:
transformers:
- $dart2js:
minify: true
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?
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.
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
How to deploy a Dart Polymer app to Javascript using dart2js
How do I pass multiple entry_points to polymer transformer in pubspec.yaml?
I am a bit confused about the launch is supposed to work. In my project I have a build.dart and a html file.
What I am doing now is run the build.dart and then run the html.
Building the dart and then refresh the browser window works also.
But I see no option to run the build.dart and then automatic refresh dartium?
My favorite method is to click on the index.html in the out directory and hit Command-r (or whatever is equivalent on your OS) to run it. This will run build.dart as well as open Dartium.