-
Notifications
You must be signed in to change notification settings - Fork 3
/
Copy path114.67d7c09e61445c62a2d1.chunk.js
1 lines (1 loc) · 5.86 KB
/
114.67d7c09e61445c62a2d1.chunk.js
1
(window.webpackJsonp=window.webpackJsonp||[]).push([[114],{375:function(n,a,s){"use strict";s.r(a),a.default='<p><a href="https://badge.fury.io/js/polymer-webpack-loader"><img src="https://badge.fury.io/js/polymer-webpack-loader.svg" alt="npm version"></a></p>\n<blockquote>\n<p><a href="https://www.polymer-project.org/">Polymer</a> component loader for <a href="/">webpack</a>.</p>\n</blockquote>\n<p>The loader processes Polymer 3 template elements to minify the html and add images, fonts and imported\nstylesheets to the webpack dependency graph.</p>\n<p><strong>Looking for the Polymer 2 version?</strong> See the\n<a href="https://github.com/webpack-contrib/polymer-webpack-loader/tree/polymer2">Polymer 2 branch</a></p>\n<h2 id="configuring-the-loader">Configuring the Loader<a href="#configuring-the-loader" aria-hidden="true"><span class="icon icon-link"></span></a></h2>\n<pre><code class="hljs language-javascript"><span class="token punctuation">{</span>\n test<span class="token punctuation">:</span> <span class="token regex">/\\.js$/</span><span class="token punctuation">,</span>\n options<span class="token punctuation">:</span> <span class="token punctuation">{</span>\n htmlLoader<span class="token punctuation">:</span> <span class="token function">Object</span> <span class="token punctuation">(</span>optional<span class="token punctuation">)</span>\n <span class="token punctuation">}</span><span class="token punctuation">,</span>\n loader<span class="token punctuation">:</span> <span class="token string">\'polymer-webpack-loader\'</span>\n<span class="token punctuation">}</span><span class="token punctuation">,</span></code></pre>\n<h3 id="options">Options<a href="#options" aria-hidden="true"><span class="icon icon-link"></span></a></h3>\n<h4 id="htmlloader-object">htmlLoader: Object<a href="#htmlloader-object" aria-hidden="true"><span class="icon icon-link"></span></a></h4>\n<p>Options to pass to the html-loader. See <a href="/loaders/html-loader/">html-loader</a>.</p>\n<h3 id="use-with-babel-or-other-js-transpilers">Use with Babel (or other JS transpilers)<a href="#use-with-babel-or-other-js-transpilers" aria-hidden="true"><span class="icon icon-link"></span></a></h3>\n<p>If you\'d like to transpile the contents of your element you can\n<a href="/configuration/module/#ruleuse">chain an additional loader</a>.</p>\n<pre><code class="hljs language-js">module<span class="token punctuation">:</span> <span class="token punctuation">{</span>\n loaders<span class="token punctuation">:</span> <span class="token punctuation">[</span>\n <span class="token punctuation">{</span>\n test<span class="token punctuation">:</span> <span class="token regex">/\\.html$/</span><span class="token punctuation">,</span>\n use<span class="token punctuation">:</span> <span class="token punctuation">[</span>\n <span class="token comment">// Chained loaders are applied last to first</span>\n <span class="token punctuation">{</span> loader<span class="token punctuation">:</span> <span class="token string">\'babel-loader\'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span>\n <span class="token punctuation">{</span> loader<span class="token punctuation">:</span> <span class="token string">\'polymer-webpack-loader\'</span> <span class="token punctuation">}</span>\n <span class="token punctuation">]</span>\n <span class="token punctuation">}</span>\n <span class="token punctuation">]</span>\n<span class="token punctuation">}</span>\n\n<span class="token comment">// alternative syntax</span>\n\nmodule<span class="token punctuation">:</span> <span class="token punctuation">{</span>\n loaders<span class="token punctuation">:</span> <span class="token punctuation">[</span>\n <span class="token punctuation">{</span>\n test<span class="token punctuation">:</span> <span class="token regex">/\\.html$/</span><span class="token punctuation">,</span>\n <span class="token comment">// Chained loaders are applied right to left</span>\n loader<span class="token punctuation">:</span> <span class="token string">\'babel-loader!polymer-webpack-loader\'</span>\n <span class="token punctuation">}</span>\n <span class="token punctuation">]</span>\n<span class="token punctuation">}</span></code></pre>\n<h2 id="boostrapping-your-application">Boostrapping Your Application<a href="#boostrapping-your-application" aria-hidden="true"><span class="icon icon-link"></span></a></h2>\n<p>The webcomponent polyfills must be added in a specific order. If you do not delay loading the main bundle with your components, you will see the following exceptions in the browser console:</p>\n<pre><code>Uncaught TypeError: Failed to construct \'HTMLElement\': Please use the \'new\' operator, this DOM object constructor cannot be called as a function.\n</code></pre>\n<p>Reference the <a href="https://github.com/webpack-contrib/polymer-webpack-loader/blob/master/demo/src/index.ejs">demo html file</a>\nfor the proper loading sequence.</p>\n<h2 id="maintainers">Maintainers<a href="#maintainers" aria-hidden="true"><span class="icon icon-link"></span></a></h2>\n<table>\n <tbody>\n <tr>\n <td align="center">\n <a href="https://github.com/bryandcoulter">\n <img width="150" height="150" src="https://avatars.githubusercontent.com/u/18359726?v=3">\n </br>\n Bryan Coulter\n </a>\n </td>\n <td align="center">\n <a href="https://github.com/ChadKillingsworth">\n <img width="150" height="150" src="https://avatars.githubusercontent.com/u/1247639?v=3">\n </br>\n Chad Killingsworth\n </a>\n </td>\n <td align="center">\n <a href="https://github.com/robdodson">\n <img width="150" height="150" src="https://avatars.githubusercontent.com/u/1066253?v=3">\n </br>\n Rob Dodson\n </a>\n </td>\n </tr>\n <tbody>\n</table>\n'}}]);