[英]How to correctly run Angular2 dart application in Dartium browser from IDEA?
How to correctly open Dart application in Dartium? 如何在Dartium中正确打开Dart应用程序?
I am doing this Angular2-Dart tutorial. 我正在做这个 Angular2-Dart教程。
To get working application, I can run pub build
command, then start http server on build/web
directory and applciation will work correctly. 要获得可用的应用程序,我可以运行
pub build
命令,然后在build/web
目录中启动http服务器,并且应用程序将正常运行。
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. 另外,我可以运行
pub serve
命令,然后在浏览器中打开localhost:8080
地址,等待一段时间进行Dart编译,该应用程序也将运行。
How to correctly run application in Dartium? 如何在Dartium中正确运行应用程序? I am going to
web/index.html
file in IDEA, press Alt + F2 (to open variants to open application with) and press dartium. 我要转到IDEA中的
web/index.html
文件,按Alt + F2(打开用于打开应用程序的变体),然后按dartium。 I don't see working application now. 我现在看不到正在运行的应用程序。 I see only
Loading...
message (because my html is <my-app>Loading...</my-app>
). 我只看到“
Loading...
消息(因为我的html是<my-app>Loading...</my-app>
)。
Also, what are benefits of using Dartium web browser when developing Dart application? 此外,在开发Dart应用程序时使用Dartium Web浏览器有什么好处? For example,
pub serve
recompile Dart code on each page refresh. 例如,每次刷新页面时
pub serve
重新编译Dart代码。 It takes really much time. 这确实需要很多时间。 May be I wouldn't spend so much time for compilation with Dartium?
也许我不会花太多时间用Dartium进行编译?
One way, I can correctly open my Dart application is dartium is: 一种可以正确打开Dart应用程序的方法是dartium:
web
directory (index.html file is here). web
目录上设置http服务器(此处是index.html文件)。 localhost:8086
in dartium. localhost:8086
。 After some time application is correctly opened. 一段时间后,将正确打开应用程序。 May be there is some problems with my intellij idea?
我的Intellij想法可能存在一些问题?
Update: 更新:
I got this in pub serve
tab in IDEA when I am trying to open index.html
with Dartium: 当我尝试使用Dartium打开
index.html
时,我在IDEA的pub serve
选项卡中得到了这个:
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.
And I see this in Dartium: 我在Dartium中看到了这一点:
I got this text when I try to open index.html with Chrome: 当我尝试使用Chrome打开index.html时收到以下文本:
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 在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 在IDEA(或WebStorm)中,您可以右键单击
web/index.html
并选择Run (index.html)
或“ Debug (index.html)
,IDEA应该
pub serve
pub serve
I don't know what Alt + F2
does because there are various of keyboard shortcut settings. 我不知道
Alt + F2
会做什么,因为有各种键盘快捷键设置。
Run in Chrome, Firefox, Safari, ... 在Chrome,Firefox,Safari等平台上运行
You should also be able to just copy the URL from Dartium to Chrome or other browsers and pub serve
serves the Dart-to-JavaScript transpiled application. 您还应该能够将URL从Dartium复制到Chrome或其他浏览器,并且
pub serve
为Dart-to-JavaScript转译应用程序提供服务。 This is more efficient than pub build
because it doesn't need to rebuild the entire application after a modification of the source. 这比
pub build
更为有效,因为在修改源代码后不需要重新pub build
整个应用程序。 It can reuse cached parts where code didn't change and is therefore much faster. 它可以重用代码未更改的缓存部分,因此速度更快。
Known issue 已知问题
There was an IDEA (and WebStorm) issue recently that resulted in a behavior similar to the one you describe. 最近有一个IDEA(和WebStorm)问题,导致与您描述的行为类似。 Please check you have the latest IDEA version.
请检查您是否拥有最新的IDEA版本。
I'm using IntelliJ IDEA 2016.3 and there is still no Run/Debug when right-clicking on web/index.html. 我正在使用IntelliJ IDEA 2016.3,右键单击web / index.html时仍然没有运行/调试。 My project is recognized as a Dart project (Pub actions are displayed when looking at pubspec.yaml).
我的项目被认为是Dart项目(查看pubspec.yaml时会显示“ Pub”操作)。
When i Open in Browser|Dartium two things happen: 当我在Browser | Dartium中打开时,会发生两件事:
1) Problem description 1)问题描述
Dartium opens with the url http://localhost:63342/enighet_register/web/index.html?_ijt=kg22cgo907ps6ivcv3sm5dmvt1 which displays forever loading because as the console log shows as Dartium is unable to find the other resources from the web directory (eg requested via http://localhost:63342/main.dart ). Dartium的URL为http:// localhost:63342 / enighet_register / web / index.html?_ijt = kg22cgo907ps6ivcv3sm5dmvt1 ,它会显示永久性加载,因为控制台日志显示为Dartium无法从Web目录中找到其他资源(例如,已请求)通过http:// localhost:63342 / main.dart )。 If you compare these two urls you notice that the first one retains the project name and web-directory, while the second one is relative to index.html.
如果比较这两个URL,则会注意到第一个保留了项目名称和Web目录,而第二个相对于index.html。 This seems to be the source of the problem.
这似乎是问题的根源。 (main.dart is available via http://localhost:63342/enighet_register/web/main.dart )
(main.dart可通过http:// localhost:63342 / enighet_register / web / main.dart获得 )
2) Workaround 2)解决方法
Opening the file in Dartium also starts the Pub Serve-tab in IntelliJ (next to the Dart Analysis- and Terminal-tab). 在Dartium中打开文件还会在IntelliJ中启动“发布服务”选项卡(“ Dart分析”和“终端”选项卡旁边)。 Here we get the line: "Serving enighet_register web on http://localhost:39030 " opening this url in Dartium (or other browsers) works perfektly fine (the port is dynamic, so check the output each time).
在这里,我们得到以下内容:“在http:// localhost:39030上为enighet_register网站提供服务”在Dartium(或其他浏览器)中打开此url可以正常工作(端口是动态的,因此请每次检查输出)。
Not sure if you can debug in IntelliJ though, but you can set breakpoints and debug within Dartium! 虽然不确定是否可以在IntelliJ中进行调试,但是可以在Dartium中设置断点并进行调试!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.