How to correctly open Dart application in Dartium?
I am doing this Angular2-Dart tutorial.
To get working application, I can run
pub build command, then start http server on
build/web directory and applciation will work correctly.
Also, I can run
pub serve command, then open
localhost:8080 address in browser, wait some time for Dart compilation and the application will work too.
How to correctly run application in Dartium? I am going to
web/index.html file in IDEA, press Alt + F2 (to open variants to open application with) and press dartium. I don’t see working application now. I see only
Loading... message (because my html is
Also, what are benefits of using Dartium web browser when developing Dart application? For example,
pub serve recompile Dart code on each page refresh. It takes really much time. May be I wouldn’t spend so much time for compilation with Dartium?
One way, I can correctly open my Dart application is dartium is:
- Set up http server on
webdirectory (index.html file is here).
- Run this server (for example on 8086 port0
After some time application is correctly opened. May be there is some problems with my intellij idea?
I got this in
pub serve tab in IDEA when I am trying to open
index.html with Dartium:
C:\tools\dart-sdk\bin\pub.bat serve web --port=53852 Loading source assets... Loading angular2 and dart_to_js_script_rewriter transformers... Serving ng2_hero_app web on http://localhost:53852 [web] GET index.html => (cached) ng2_hero_app|web/index.html [web] GET Served 9 cached assets. Build completed successfully [web] GET Served 2 cached assets. [web] GET Served 3 cached assets. [web] GET packages/angular2/src/core/metadata.dart => (cached) angular2|lib/src/core/metadata.dart [web] GET packages/angular2/src/core/util.dart => (cached) angular2|lib/src/core/util.dart [web] GET packages/angular2/src/core/di.dart => (cached) angular2|lib/src/core/di.dart [web] GET packages/angular2/src/facade/facade.dart => (cached) angular2|lib/src/facade/facade.dart [web] GET packages/angular2/src/core/application_ref.dart => (cached) angular2|lib/src/core/application_ref.dart [web] GET packages/angular2/src/core/application_tokens.dart => (cached) angular2|lib/src/core/application_tokens.dart [web] GET packages/angular2/src/core/zone.dart => (cached) angular2|lib/src/core/zone.dart [web] GET packages/angular2/src/core/render.dart => (cached) angular2|lib/src/core/render.dart [web] GET packages/angular2/src/core/linker.dart => (cached) angular2|lib/src/core/linker.dart [web] GET packages/angular2/src/core/debug/debug_node.dart => (cached) angular2|lib/src/core/debug/debug_node.dart [web] GET packages/angular2/src/core/testability/testability.dart => (cached) angular2|lib/src/core/testability/testability.dart [web] GET packages/angular2/src/core/change_detection.dart => (cached) angular2|lib/src/core/change_detection.dart [web] GET packages/angular2/src/core/platform_directives_and_pipes.dart => (cached) angular2|lib/src/core/platform_directives_and_pipes.dart [web] GET packages/angular2/src/core/platform_common_providers.dart => (cached) angular2|lib/src/core/platform_common_providers.dart [web] GET packages/angular2/src/core/application_common_providers.dart => (cached) angular2|lib/src/core/application_common_providers.dart [web] GET packages/angular2/src/core/reflection/reflector.dart => (cached) angular2|lib/src/core/reflection/reflector.dart [web] GET packages/angular2/src/core/reflection/types.dart => (cached) angular2|lib/src/core/reflection/types.dart [web] GET packages/angular2/src/core/reflection/platform_reflection_capabilities.dart => (cached) angular2|lib/src/core/reflection/platform_reflection_capabilities.dart [web] GET packages/angular2/src/facade/lang.ngfactory.dart => (cached) angular2|lib/src/facade/lang.ngfactory.dart [web] GET packages/angular2/src/platform/browser_common.ngfactory.dart => (cached) angular2|lib/src/platform/browser_common.ngfactory.dart [web] GET packages/angular2/core.ngfactory.dart => (cached) angular2|lib/core.ngfactory.dart [web] GET packages/angular2/src/core/angular_entrypoint.ngfactory.dart => (cached) angular2|lib/src/core/angular_entrypoint.ngfactory.dart [web] GET packages/angular2/src/facade/collection.dart => (cached) angular2|lib/src/facade/collection.dart [web] GET packages/angular2/src/core/change_detection/change_detection.dart => (cached) angular2|lib/src/core/change_detection/change_detection.dart [web] GET packages/angular2/src/core/metadata/di.dart => (cached) angular2|lib/src/core/metadata/di.dart [web] GET Served 2 cached assets.
I got this text when I try to open index.html with Chrome:
C:\tools\dart-sdk\bin\pub.bat serve web --port=54019 Loading source assets... Loading angular2 and dart_to_js_script_rewriter transformers... Serving ng2_hero_app web on http://localhost:54019 [web] GET index.html => (cached) ng2_hero_app|web/index.html [web] GET Served 3 cached assets. Build completed successfully
Run and debug in Dartium
In IDEA (or WebStorm) you can just right-click on
web/index.html and select
Run (index.html) or
Debug (index.html) and IDEA should
- start Dartium
- load index.html
I don’t know what
Alt + F2 does because there are various of keyboard shortcut settings.
Run in Chrome, Firefox, Safari, …
You should also be able to just copy the URL from Dartium to Chrome or other browsers and
pub build because it doesn’t need to rebuild the entire application after a modification of the source. It can reuse cached parts where code didn’t change and is therefore much faster.
There was an IDEA (and WebStorm) issue recently that resulted in a behavior similar to the one you describe. Please check you have the latest IDEA version.
Answered By – Günter Zöchbauer
Answer Checked By – Robin (FlutterFixes Admin)