Dart WebComponent上不允许使用绝对路径(Absolute paths not allowed on Dart WebComponent)

编程入门 行业动态 更新时间:2024-10-28 02:33:50
Dart WebComponent上不允许使用绝对路径(Absolute paths not allowed on Dart WebComponent)

到目前为止,我的小Dart / Polymer样品效果很好。 (GitHub的)

这是我使用的yaml文件:

name: PolymerHelloWorld
environment:
  sdk: any
dependencies:
  browser: any
  polymer: any
  shadow_dom: any
  mdv: any

transformers:
-  polymer:
    entry_points:
    - web/index.html
    - web/hello-world/hello-world.html
    - web/stopwatch/stopwatch.html
 

“pub build”产生:(在GH下再次生活)

从我的理解现在我有2个web组件:hello-world和秒表

我做了第二个项目,完全独立于PolymerHelloWorld。 这是index.html:

我收到此错误消息

pub build Building PolymerSecondWorld... [Error from polymer (Linter) on PolymerSecondWorld|web/index.html]: web/index.html:4:5: absolute paths not allowed: "https://rawgithub.com/MikeMitterer/DART-Sample-PolymerHelloWorld/master/build/hello-world/hello-world.html"

这不是webcomponents的想法吗? 我错过了什么吗?

[ 更新 ] 我在我的GH-Repo中添加了DART-Sample-PolymerElementConsumer 。 它包括整个聚合物的东西......这个样本不是 Dart样本。 它使用聚合物来导入组件。 至少 - 它试图......

这是它尝试运行的HTML: https://rawgithub.com/MikeMitterer/DART-Sample-PolymerElementConsumer/master/web/index.html

CODEVIEW: https://raw.github.com/MikeMitterer/DART-Sample-PolymerElementConsumer/master/web/index.html

HTML页面没有显示任何错误消息 - 没有。 只是标题,但没有来自webcomponent。

My little Dart/Polymer sample works nice so far. (GitHub)

Here is the yaml file I use:

name: PolymerHelloWorld
environment:
  sdk: any
dependencies:
  browser: any
  polymer: any
  shadow_dom: any
  mdv: any

transformers:
-  polymer:
    entry_points:
    - web/index.html
    - web/hello-world/hello-world.html
    - web/stopwatch/stopwatch.html
 

"pub build" produces: (Live again under GH)

From my understanding now I have 2 webcomponents: hello-world and stopwatch

I made a second project, completely independent form PolymerHelloWorld. Here is the index.html:

I get this error message

pub build Building PolymerSecondWorld... [Error from polymer (Linter) on PolymerSecondWorld|web/index.html]: web/index.html:4:5: absolute paths not allowed: "https://rawgithub.com/MikeMitterer/DART-Sample-PolymerHelloWorld/master/build/hello-world/hello-world.html"

Isn't this the idea of webcomponents? Do I miss something?

[Update] I added DART-Sample-PolymerElementConsumer to my GH-Repo. It includes the whole polymer stuff... This sample is not a Dart-Sample. It uses polymer to import the component. At least - it tries to...

Here is the HTML it try to run: https://rawgithub.com/MikeMitterer/DART-Sample-PolymerElementConsumer/master/web/index.html

Codeview: https://raw.github.com/MikeMitterer/DART-Sample-PolymerElementConsumer/master/web/index.html

The HTML-Page shows no error message - nothing. Just the headline but nothing from the webcomponent.

最满意答案

如果要导入Polymer元素,则必须使用Dart包(例如pub.dartlang.org)。 您将包添加到pubspec.yaml以将包导入项目和 然后您可以从packages目录中导入元素/组件。

聚合物对Dart项目中的导入路径也非常敏感 而你最终尝试过的东西是行不通的 (这可以在JavaScript中工作)但是这需要执行在Dart不支持的运行时加载的代码(包含在加载的组件中)。 所有代码必须在编译时可用。

关于这个主题的一些讨论:

使用href =“package:...”导入组件时出现问题 应该HTML Imports支持包:scheme? 如何在HTML和Dart中导入自定义元素? (包括解决方法) 使用涉及包的html-imports来改进规范化问题

编辑

我看了你的代码并试图理解你的评论,并相应地扩展了我的答案。

为了能够从包中导入组件,组件必须位于要导入的包的lib目录中。 使用(导入)元素的网页必须是Dart项目(包),它在'pubspec.yaml'中导入组件包。 对于Web应用程序(index.html,...), web是包中的正确目录。

If you want to import Polymer elements they have to be in a Dart package (e.g pub.dartlang.org). You add the package to you pubspec.yaml to import the package into your project and then you can import the elements/components from the packages directory.

Polymer is also very delicate about the import paths within a Dart project and something like you tried definitively won't work (this could work in JavaScript though) but this would require to execute code (included within the loaded component) loaded at runtime which Dart doesn't support yet. All code has to be available at compile time.

Some discussions about this topic:

trouble importing components using href="package:..." should HTML Imports support package: scheme? How can I import a custom element in both HTML and Dart? (workaround included) improve canonicalization issues with html-imports involving packages

EDIT

I looked at your code and tried to understand your comment and extended my answer accordingly.

To be able to import components from a package the components have to be in the lib directory of the package you want to import. The web page using (importing) elements has to be a Dart project (package) which imports the component package in 'pubspec.yaml'. For the web application (index.html, ...) web is the correct directory within the package.

更多推荐

本文发布于:2023-08-05 19:34:00,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1439386.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:上不   绝对路径   WebComponent   Dart   paths

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!