Polymer-installation
提供:Dev Guides
ポリマー-インストール
システムでPolymerを構成するのは簡単です。 以下は、Polymerをインストールする2つの方法です。
- Polymer CLI(コマンドラインインターフェイス)
- バウアー
Polymer CLIを使用したPolymerのインストール
- ステップ1 *-次のnpmコマンドを使用してPolymerをインストールします。
npm install -g polymer-cli@next
- ステップ2 *-次のコマンドを使用して、正常なインストールとバージョンを確認します。
polymer --version
それが正常にインストールされている場合、次のようにバージョンが表示されます-
- ステップ3 *-選択した名前でディレクトリを作成し、そのディレクトリに切り替えます。
mkdir polymer-js
cd polymer-js
- ステップ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
- ステップ5 *-上記のオプションからポリマー2アプリケーションを選択します。
ここで、次のコマンドを使用してプロジェクトを開始します。
polymer serve
Bowerを使用したポリマーのインストール
- ステップ1 *-Bowerメソッドを使用してゼロから開始するには、次のコマンドを使用してBowerをインストールします。
npm install -g bower
- ステップ2 *-次のコマンドを使用してポリマーをインストールします。
npm install -g polymer-cli@next
- ステップ3 *-次のコマンドを使用して、Polymerの正常なインストールとバージョンを確認します。
polymer --version
それが正常にインストールされている場合、次のようにバージョンが表示されます-
0.18.0-pre.13.
- ステップ4 *-bowerから最新のPolymer 2.0 RCリリースをインストールするには、次のコマンドを使用します。
bower install Polymer/polymer#^2.0.0-rc.3
ステップ5 *- *indexl ファイルを作成し、<head>タグに次のコードを追加します。
<script src = "/bower_components/webcomponentsjs/webcomponentsloader.js"></script>
//it loads the polyfills
<link rel = "import" href = "/bower_components/polymer/polymerl">
//it import Polymer
- ステップ6 *-次のコマンドを使用してプロジェクトを開始します。
polymer serve
展開のための構築
プロジェクトを展開用にビルドするには、 polymer build コマンドがより簡単な方法であり、コマンドラインフラグに応じてコードを縮小、コンパイル、またはバンドルします。
すべてのブラウザーで機能するユニバーサルビルドを作成するには、次のコマンドを使用します。
polymer build --js-compile
上記のコマンドはプロジェクトをbuild/defaultにビルドし、次のコマンドを使用してこのディレクトリを起動できます。
polymer serve build/default
Polymer 2.0は、ES6およびHTMLカスタム要素を使用します。 ベストプラクティスとして、ES6を完全にサポートしているブラウザーでES6を使用し、ES6をサポートしていない古いブラウザーにES5をコンパイルすることをお勧めします。 次の表は、プロジェクトに最適な戦略を示しています。
Strategy | Easiest for cross-browser support | Most optimal for WC v1 performance |
---|---|---|
Server | Any server works, including static ones | Differential serving required |
Deployed Code | ES5 transpiled | ES6 |
Polyfill Loader | webcomponents-es5-loader.js | webcomponents-loader.js |