Question

我正在使用pikaday创建聚合物日期选择器。可悲的是，我似乎有些不对劲。

我想以正确的方式导入pikaday.css和dom-module 。

首先，我在结束</dom-module> <script src="../../pikaday/pikaday.js"></script> <script> Polymer({ //.... - 标记下面有一个简单的脚本标记，例如

 <link rel="import" href="../../paper-input/paper-input-behavior.html">
 <link rel="import" href="../../paper-input/paper-input-error.html">
 <link rel="import" href="../../pikaday/pikaday.js">
 //more imports....

这样，datepicker就按预期创建了。但在阅读了这篇SO-Thread后，我觉得我应该像这样导入js文件：

pikaday.js

但是＆＃34;修复＆＃34;我的导入，文件Uncaught ReferenceError: Pikaday is not defined似乎从我的组件中看不到：

my-datepicker-style.html

此外，我对使用外部CSS感到困惑。看完this guide之后，好像我应该复制＆amp;将提供的css文件的内容粘贴到<dom-module id="my-datepicker"> <template> <style include="my-datepicker-style"></style> <style> :host { //more css并将其导入我的模板，如下所示：

{{1}}

我对复制和复制的必要性感到困惑。粘贴现有代码。

Answer 1

在ES6导入更常见之前，您需要某种解决方法来引用依赖项。

<script>标记的问题是，当它多次出现时，会多次处理。 <link rel="import">不是这样。相同的href只会被处理一次。

但是，您无法直接导入javascript。诀窍是使用脚本引用

创建pikaday-import.html文件

<script src="../../pikaday/pikaday.js"></script>

然后在元素的html

中导入它

<link rel="import" href="pikaday-import.html" />
<dom-module id="my-datepicker"></dom-module>

这是一种技术，例如<marked-element> uses。

这样<my-datepicker>的实例仅加载一次pickaday。不幸的是，如果有其他组件引用它，您最终可能会多次加载依赖项。

在聚合物中使用第三方依赖（pikadate）

1 个答案: