聚合物问题在主要硫化包之外导入脚本

Question

When developing polymer webcomponents, I eventually run them through vulcanize to be served on production. 在开发聚合物纤网组件时，我最终将它们进行硫化处理以用于生产。 unfortunately this causes a issue for me when I would like to use two separate bundles. 不幸的是，当我想使用两个单独的捆绑包时，这给我带来了一个问题。

I have for example a base.html file that contains all the main imports that will be used across the site, on every page. 例如，我有一个base.html文件，其中包含将在网站的每个页面上使用的所有主要导入。 I vulcanize this as base.build.html . 我将其硫化为base.build.html 。

Then for different pages, I might have a custom import just for that page eg. 然后对于不同的页面，例如，我可能只针对该页面进行了自定义导入。 contact-page.html

Both of these are loaded in <head> 这两个都加载在<head>

Example Snippet: 示例片段：

<head>
    <!-- snip -->

    <!-- This is the vulcanized file -->
    <link rel="import" href="/static/elements/site-base.build.html">

    <!-- This extra import causes the extra errors -->
    <link rel="import" href="/static/elements/timeline-base.html">
    <!--
        File above is not currently vulcanized, but the import still breaks
        even if it is

        merging that import into site-base solves the problem.

        Also, if the site-base import _is not_ vulcanized, then both imports
        work fine
    -->

    <!-- snip -->
</head>

The Idea here being that base.build.html is cached and available on all subsequent pages. 这里的想法是base.build.html被缓存，并且在所有后续页面上都可用。 Other bundles are only loaded and cached as required. 其他捆绑包仅根据需要加载和缓存。

The problem is that, if I only load my base bundle, all webcomponents works fine; 问题是，如果我仅加载基本捆绑包，则所有Web组件都可以正常工作。 But if I then do any extra imports then most of the webcomponents on the page breaks, with tonnes of error messages in the console. 但是，如果我再进行其他导入，则页面上的大多数Web组件都会中断，控制台中会出现大量错误消息。

The current workaround is to just include all the extra imports in my base bundle, but this of course ends up with having a larger bunlde file loading scripts and css which I don't need on every page. 当前的解决方法是仅将所有额外的导入都包含在我的基本捆绑软件中，但这当然会导致拥有更大的Bunlde文件加载脚本和CSS，而我并不需要在每个页面上。

Is this a trick with Vulcanize? 这是Vulcanize的把戏吗？ Or maybe it's got something to do with the import order for the scripts? 还是与脚本的导入顺序有关？

NOTE : The sites in question are not single page apps. 注意：有问题的网站不是单页应用程序。 These are traditional server side rendered website templates, so the build process is very different to much of the polymercli tooling. 这些是传统的服务器端渲染的网站模板，因此构建过程与大多数polymercli工具非常不同。

Answer 1

Without seeing the error messages you get, I assume the issue you have is, that your extra imports include elements (and most likely polymer.html) that are already bundled in your vulcanized base package. 在没有看到您收到的错误消息的情况下，我认为您遇到的问题是，您的额外导入内容包括已捆绑在硫化基础包装中的元素（很可能是polymer.html）。 And Polymer throws an error when it tries to initialize the same element twice. 当Polymer尝试两次初始化同一元素时，它将引发错误。

What this means is that you usually can't mix vulcanized with non-vulcanized packages. 这意味着您通常不能将硫化和非硫化包装混合使用。

Getting multiple vulcanized packages to work together can be very tricky as well, and you will have to play with the -exclude and/or -strip-exclude option of vulcanize to make sure no elements (and their dependencies) that are included in the first bundle will be included in the second bundle. 使多个硫化的包装一起使用也可能非常棘手，并且您必须使用-exclude和/或-strip-exclude选项，以确保第一个中不包含任何元素（及其依赖项）捆绑包将包含在第二个捆绑包中。

聚合物问题在主要硫化包之外导入脚本

问题描述

1 个解决方案

解决方案1
1 已采纳 2017-02-16 20:56:27

聚合物问题在主要硫化包之外导入脚本

问题描述

1 个解决方案

解决方案1 1 已采纳 2017-02-16 20:56:27

解决方案1
1 已采纳 2017-02-16 20:56:27