ポリマー-インストール

システムでPolymerを構成するのは簡単です。以下は、Polymerをインストールする2つの方法です。

ポリマーCLI（コマンドラインインターフェイス）
バウアー

PolymerCLIを使用したPolymerのインストール

Step 1 −次のnpmコマンドを使用してPolymerをインストールします。

npm install -g polymer-cli@next

Step 2 −次のコマンドを使用して、正常にインストールされ、バージョンが確認されます。

polymer --version

正常にインストールされている場合は、バージョンが-として表示されます。

Step 3 −選択した名前でディレクトリを作成し、そのディレクトリに切り替えます。

mkdir polymer-js 
cd polymer-js

Step 4−プロジェクトを初期化するには、polymer-jsdirectoryで次のコマンドを実行します。

polymer init

上記のコマンドを実行すると、次のように表示されます-

C:\polymer-js>polymer init 
? Which starter template would you like to use? 
   1) polymer-1-element - A simple Polymer 1.0 element template 
   2) polymer-2-element - A simple Polymer 2.0 element template 
   3) polymer-1-application - A simple Polymer 1.0 application template 
   4) polymer-2-application - A simple Polymer 2.0 application 
   5) polymer-1-starter-kit - A Polymer 1.x starter application template, with 
      navigation and "PRPL pattern" loading 
   6) polymer-2-starter-kit - A Polymer 2.x starter application template, with 
      navigation and "PRPL pattern" loading 
   7) shop - The "Shop" Progressive Web App demo
   Answer: 4

Step 5 −上記のオプションからポリマー2アプリケーションを選択します。

次に、次のコマンドを使用してプロジェクトを開始します。

polymer serve

Bowerを使用したポリマーのインストール

Step 1 − Bowerメソッドを使用して最初から開始するには、次のコマンドを使用してBowerをインストールします。

npm install -g bower

Step 2 −次のコマンドを使用してポリマーをインストールします。

npm install -g polymer-cli@next

Step 3 −次のコマンドを使用して、Polymerの正常なインストールとバージョンを確認します。

polymer --version

正常にインストールされている場合は、バージョンが-として表示されます。

0.18.0-pre.13.

Step 4 −バウアーから最新のPolymer 2.0 RCリリースをインストールするには、次のコマンドを使用します。

bower install Polymer/polymer#^2.0.0-rc.3

Step 5 −作成する index.html ファイルを作成し、<head>タグに次のコードを追加します。

<script src = "/bower_components/webcomponentsjs/webcomponentsloader.js"></script> 
// it loads the polyfills 

<link rel = "import" href = "/bower_components/polymer/polymer.html"> 
// it import Polymer

Step 6 −次のコマンドを使用してプロジェクトを開始します。

polymer serve

展開のための構築

デプロイ用のプロジェクトをビルドするには、 polymer build コマンドは、コマンドラインフラグに応じてコードを縮小、コンパイル、またはバンドルする簡単な方法です。

すべてのブラウザで機能するユニバーサルビルドを作成するには、次のコマンドを使用します。

polymer build --js-compile

上記のコマンドは、build / defaultにプロジェクトをビルドし、次のコマンドを使用してこのディレクトリを開始できます。

polymer serve build/default

Polymer 2.0は、ES6およびHTMLカスタム要素を使用します。ベストプラクティスとしては、ES6を完全にサポートしているブラウザにES6を使用し、ES6をサポートしていない古いブラウザにES5をコンパイルすることをお勧めします。次の表は、プロジェクトに最適な戦略を示しています。

戦略	クロスブラウザのサポートが最も簡単	WCv1のパフォーマンスに最適
サーバ	静的サーバーを含むすべてのサーバーが機能します	ディファレンシャルサービングが必要
デプロイされたコード	ES5トランスパイル	ES6
ポリフィルローダー	webcomponents-es5-loader.js	webcomponents-loader.js