Polimer - Kurulum

Polimer'i sisteminizde yapılandırmak kolaydır. Polimer kurmanın iki yolu aşağıdadır.

  • Polimer CLI (Komut Satırı Arayüzü)
  • The Bower

Polimer CLI Kullanarak Polimer Yükleme

Step 1 - Aşağıdaki npm komutunu kullanarak Polimer kurun.

npm install -g polymer-cli@next

Step 2 - Aşağıdaki komutu kullanarak başarılı kurulumu ve sürümü kontrol edin.

polymer --version

Başarıyla yüklendiyse, sürümü şu şekilde gösterecektir -

Step 3 - Seçtiğiniz adla bir dizin oluşturun ve o dizine geçin.

mkdir polymer-js 
cd polymer-js

Step 4- Projenizi başlatmak için, polimer-js dizininizde aşağıdaki komutu çalıştırın .

polymer init

Yukarıdaki komutu uyguladıktan sonra, şuna benzer bir şey gösterecektir -

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 - Yukarıda verilen seçeneklerden polimer-2-uygulamasını seçin.

Şimdi, aşağıdaki komutu kullanarak projenize başlayın.

polymer serve

Polimerin Bower Kullanılarak Takılması

Step 1 - Bower yöntemini kullanarak sıfırdan başlamak için aşağıdaki komutu kullanarak Bower'ı kurun.

npm install -g bower

Step 2 - Aşağıdaki komutu kullanarak Polimeri kurun.

npm install -g polymer-cli@next

Step 3 - Aşağıdaki komutu kullanarak Polymer'in başarılı kurulumunu ve sürümünü kontrol edin.

polymer --version

Başarıyla yüklendiyse, sürümü şu şekilde gösterecektir -

0.18.0-pre.13.

Step 4 - En son Polymer 2.0 RC sürümünü bower'dan yüklemek için aşağıdaki komutu kullanın.

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

Step 5 - Bir index.html dosyasını açın ve aşağıdaki kodu <head> etiketine ekleyin.

<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 - Aşağıdaki komutu kullanarak projenizi başlatın.

polymer serve

Dağıtım için Oluşturma

Projenizi dağıtım için oluşturmak için, polymer build komutu, komut satırı bayraklarına bağlı olarak kodunuzu küçültecek, derleyecek veya paketleyecek daha kolay bir yoldur.

Tüm tarayıcılarda çalışan evrensel bir yapı oluşturmak için aşağıdaki komutu kullanın.

polymer build --js-compile

Yukarıdaki komut, projeyi build / default olarak oluşturacaktır ve aşağıdaki komutu kullanarak bu dizini başlatabilirsiniz.

polymer serve build/default

Polymer 2.0, ES6 ve HTML Özel Öğeleri kullanır. En iyi uygulama için, ES6'yı tam ES6 desteğine sahip tarayıcılarda kullanmak ve ES5'i ES6'yı desteklemeyen eski tarayıcılarda derlemek her zaman iyidir. Aşağıdaki tablo projeniz için en iyi stratejiyi göstermektedir.

Strateji Tarayıcılar arası destek için en kolay WC v1 performansı için en uygun
Sunucu Statik olanlar dahil herhangi bir sunucu çalışır Diferansiyel sunum gerekli
Dağıtılan Kod ES5 aktarılmış ES6
Polyfill Yükleyici webcomponents-es5-loader.js webcomponents-loader.js