聚合物 3 相对路径
polymer 3 relative paths
我想将聚合物元素从聚合物 2 迁移到聚合物 3。
聚合物元素使用包含 .svg 文件的文件夹的相对路径。
const url = this.resolveUrl('./icons/' + this.icon + '.svg');
问题是旧的组件文件是一个 .html 文件，所以如果你包含它，脚本部分中的相对路径总是相同的。
现在组件文件是一个 javascript 文件，因此相对路径 (.) 是包含 javascript 文件的文件的路径。
要解决此问题，请将以下 getter 方法添加到您的元素 class:
static get importMeta() {
return import.meta;
}
加载元素时，上面的 getter 会分配元素的 importPath 属性。 resolveUrl 现在将基于 importPath 而非基于主文档解析相对路径。
顺便说一句，您也可以在数据绑定中使用 importPath，如下所示：
<img src$="[[importPath]]/icons/[[icon]].png">
有关 Polymer 为什么默认不重写模板中的 URL 的更多信息，see the documentation on DOM templating。
（顺便说一句，该页面上关于 importPath 的内容似乎需要更新。我 raised an issue 以使用我在上面概述的最新信息更新网站。）
希望对您有所帮助
我想将聚合物元素从聚合物 2 迁移到聚合物 3。
聚合物元素使用包含 .svg 文件的文件夹的相对路径。
const url = this.resolveUrl('./icons/' + this.icon + '.svg');
问题是旧的组件文件是一个 .html 文件，所以如果你包含它，脚本部分中的相对路径总是相同的。
现在组件文件是一个 javascript 文件，因此相对路径 (.) 是包含 javascript 文件的文件的路径。
要解决此问题，请将以下 getter 方法添加到您的元素 class:
static get importMeta() {
return import.meta;
}
加载元素时，上面的 getter 会分配元素的 importPath 属性。 resolveUrl 现在将基于 importPath 而非基于主文档解析相对路径。
顺便说一句，您也可以在数据绑定中使用 importPath，如下所示：
<img src$="[[importPath]]/icons/[[icon]].png">
有关 Polymer 为什么默认不重写模板中的 URL 的更多信息，see the documentation on DOM templating。
（顺便说一句，该页面上关于 importPath 的内容似乎需要更新。我 raised an issue 以使用我在上面概述的最新信息更新网站。）
希望对您有所帮助