我試圖從polymer-element創建自定義元素，但我無法使@CustomTag工作。我dart文件（my_element.dart）看起來是這樣的：HTML導入：CustomTag未註冊
@HtmlImport('my_element.html')
library projects.projectFolder.layout;
import 'package:polymer/polymer.dart';
import 'dart:html';
@CustomTag('my-element')
class MyElement extends PolymerElement {
@published String caption;
MyElement.created() : super.created();
}
我html文件（my_element.html）看起來是這樣的：
<link rel="import" href="../../../../packages/polymer/polymer.html">
<polymer-element name="my-element">
<template>
<link rel="stylesheet" href="my_element.css">
<core-toolbar>
<h1>{{ caption }}</h1>
</core-toolbar>
</template>
<script type="application/dart" src="../my_element.dart"></script>
</polymer-element>
的事情是，在Chrome控制檯保持上打印以下錯誤：
No elements registered in a while, but still waiting on 1 elements to be registered. Check that you have a class with an @CustomTag annotation for each of the following tags: 'my-element'.
這很好奇，因爲我已經聲明瞭自定義標籤，因爲它應該是。它看起來好像在達到.html時沒有讀到.dart文件。
.html文件從另一個父文件.html中調用。我認爲文件被調用的順序可能是問題，但如果在運行之前編譯Dart，它應該不會在意。
我已經嘗試了幾種解決方案，但他們都沒有工作。唯一的工作是非常骯髒的，這是直接從主my_app.dart文件導入my_element.dart文件。我想這不應該這樣做，因爲這意味着導入每個my_element.dart文件在同一主my_app.dart。
EDIT（添加index.html，pubspec.yml）
我index.html文件看起來像如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<title>My app</title>
</head>
<body unresolved fullbleed>
<my-app></my-app>
<script type="application/dart">
import 'package:polymer/polymer.dart';
import 'package:project/my_app.dart';
main() => initPolymer();
</script>
</body>
</html>
my_app是另一種自定義元素，這是主要的元素，所有的人去。換句話說，它就像應用程序的主控制器一樣。該元素還有一個.dart和.html文件，該文件將調用其他元素，如my-element。
正如你所看到的，我的main()功能非常簡單，因爲它只啓動Polymer（見index.html）。
我pubspec.yml看起來像以下：
name: project
version: 0.0.1
description: Some project.
author: Tomas
homepage: https://github.com/*******
environment:
sdk: '>=1.10.0 <2.0.0'
dependencies:
polymer: '^0.16.0'
core_elements: '^0.7.1'
paper_elements: '^0.7.1'
route_hierarchical: "^0.6.1"
transformers:
- polymer:
entry_points: web/index.html
- $dart2js:
$include: "**/*.polymer.bootstrap.dart"
我的目錄看起來像這樣（我只是顯示它的一小部分，最重要的一個，我希望）：
.
├── README.md
├── build
│ └── web
│ ├── index.html
│ ├── index.html.polymer.bootstrap.dart.js
│ └── packages
├── lib
│ ├── my_app.dart
│ └── src
│ ├── elements
│ ├── layout
│ │ ├── my_element.css
│ │ ├── my_element.dart
│ │ └── my_element.html
│ ├── my_app.css
│ ├── my_app.html
│ └── modules
│ └── module.dart
│ ├── my_app.css
├── pubspec.lock
├── pubspec.yaml
└── web
│ ├── index.html
│ └── packages -> ../packages
│ ├── my_app.html
│ └── modules
│ └── module.dart
我希望這個編輯不會混淆超過它應該。我只是想知道哪個是Dart應用的正確文件夾結構和導入形式。
簡而言之：在飛鏢中編寫大型應用程序時樹應該如何顯示，我應該在哪裏進行導入？我已經查看了所有可能的文檔，包括一些教程，但是他們都討論了非常簡單的示例，其中大部分代碼位於web文件夾中，我不想這樣做。
EDIT（總結和改寫，添加my_app.html和my_app.dart）
更少的話：
我已經my_element.html和my_element.dart（在這個答案上面定義的）定義的定製元素，我想只使用html將其導入另一個my_app元素。即不是由my_app.dart進口my_element.dart，但只使用link標籤進口my_element.html在my_app.html：
<link rel="import" href="../../../packages/polymer/polymer.html">
<link rel="import" href="layout/my_element.html">
<polymer-element name="my-app">
<template>
<core-scaffold id="scaffold">
<my-element tool flex></my-element>
<main fit></main>
</core-scaffold>
</template>
<script type="application/dart" src="../my_app.dart"></script>
</polymer-element>
my_app.dart：
@HtmlImport('src/my_app.html')
import 'package:polymer/polymer.dart';
import 'package:core_elements/core_scaffold.dart';
@CustomTag('my-app')
class MyApp extends PolymerElement {
MyApp.created() : super.created();
}
不應該<script type="application/dart" src="../my_element.dart"></script>足以告訴編譯器加載鏢通過遵循由html導入定義的傳遞依賴註冊元素標記的文件？
你的'main（）'，'索引如何。 html'和'pubspec.yaml'看起來像？您的元素文件在哪個目錄中？ –
我剛剛對顯示所需信息的問題進行了編輯。謝謝你的幫助 ：）。 – tomasyany
只需確認，您的'my_app.dart'文件是否導入您的'my_element.dart'文件？ –