web-dev-qa-db-ja.com

polymer要素のCDNはありますか?

polymer要素のCDNがあるかどうかを知りたいのですが、これは常に要素をダウンロードする必要があり、cdn経由でインポートする方が便利だからです。Googleで何も見つかりません。 ?また、それが存在しない、またはそれがとても新しいという理由だけで何か理由はありますか?

21
gorgi93

現在、CDNホスティングpolymer要素を知りません。本番環境では、それらをvulcanizeする方がよいと思いますが、ほとんどの要素がgithubでホストされている場合は、インポートをrawgit.comにリンクできます。

例:

<link rel="import" href="https://rawgit.com/Polymer/core-ajax/master/core-ajax.html">
3
Oliver

今あります!

この目的のために、このGitHubリポジトリを作成しました。

ダウンロード/ポリマー-cdn

すべてのGitHubリポジトリは、 RawGit を介して自動的にCDNに格納されます。したがって、これを使用して、次のようなマークアップを使用してPolymer要素をインポートできます(for iron-icons この場合):

<link rel="import" 
      href="https://cdn.rawgit.com/download/polymer-cdn/1.0.1/lib/iron-icons/iron-icons.html">

プロジェクト構造は、インポートする要素(推移的な依存関係)からのインポートが正しく解決されるように設定されています。

リポジトリのreadmeには、リポジトリに含まれるすべての要素のリストがあります。

何かが足りない? 教えてください そして私はそれを含めさせていただきます。

それを試してみてください

このCodepenをハッキングすることで、今すぐ試すことができます。

ポリマー-CDNの例

または、次のコードスニペットを実行できます。

<base href="https://cdn.rawgit.com/download/polymer-cdn/1.5.0/lib/">
<script src="webcomponentsjs/webcomponents-lite.min.js"></script>
<link rel="import" href="iron-icon/iron-icon.html">
<link rel="import" href="iron-icons/iron-icons.html">
<link rel="import" href="paper-button/paper-button.html">
<link rel="import" href="paper-checkbox/paper-checkbox.html">
<link rel="import" href="paper-tabs/paper-tabs.html">
<link rel="import" href="paper-toggle-button/paper-toggle-button.html">
<style is="custom-style">
  :root {
    --paper-tabs-selection-bar-color: var(--paper-light-blue-900);
    --paper-tab-ink: var(--paper-light-blue-100);
    --paper-tabs: {
      color: white;
      background-color: var(--paper-light-blue-500);
    };
  }
</style>

<div>
  <paper-button raised><iron-icon icon="check"></iron-icon>OK</paper-button>
  <paper-button raised><iron-icon icon="clear"></iron-icon>Cancel</paper-button>
</div>

<p><paper-checkbox>Checkbox</paper-checkbox></p>

<p><paper-toggle-button></paper-toggle-button></p>

<paper-tabs selected="0">
  <paper-tab>TAB 1</paper-tab>
  <paper-tab>TAB 2</paper-tab>
  <paper-tab>TAB 3</paper-tab>
</paper-tabs>
22
Stijn de Witt

polymer-project.orgから直接polymer要素にアクセスすることもできます。

<link rel="import" href="https://www.polymer-project.org/0.5/components/core-ajax/core-ajax.html">
6
CletusW

これは古い質問ですが、今ではハッキーではない解決策があります: http://polygit.org/

カーテンの後ろでrawgitを使用しますが、はるかに優れたAPIを提供します。

5
Johannes Reuter

rawgitオプション

Core-ajax.htmlはpolymer.htmlで404を返すため、いくつかの依存関係を手動で管理する必要があります。また、rawgit.comキャッシュはわずか5分に設定されています(cache-control:max-age = 300)。バージョン管理には5分のキャッシュで十分ですが、CDNではもっと多くする必要があります( https://rawgit.com/Polymer/core-ajax/0.4.1/core-xhr.html )。また、ファイルは縮小されません。

加硫オプション

Http/2リリース前のおそらく最良のオプション。構成とビルドプロセスへの統合に時間を費やす必要があります。また、CDNのメリットはありません(データコストがなく、サードパーティのドメインからすでにキャッシュされているリソースです)。

結論

Http/2リリースでは、polymerバージョンと長い有効期限のヘッダーを持つCDNがいくつかあります。しかし、現時点ではわかりません。

1
Pavel Cibulka

クラウドフレアをご覧くださいpolymer CDN: http://cdnjs.com/libraries/polymer

1