Polímero - Instalação
É fácil configurar o Polymer em seu sistema. A seguir estão as duas maneiras de instalar o Polymer.
- O Polymer CLI (interface de linha de comando)
- The Bower
Instalação de polímero usando CLI de polímero
Step 1 - Instale o Polymer usando o seguinte comando npm.
npm install -g polymer-cli@next
Step 2 - Verifique a instalação e a versão bem-sucedidas usando o seguinte comando.
polymer --version
Se tiver sido instalado com sucesso, ele mostrará a versão como -
Step 3 - Crie um diretório com o nome de sua escolha e mude para esse diretório.
mkdir polymer-js
cd polymer-js
Step 4- Para inicializar seu projeto, execute o seguinte comando em seu polímero-jsdirectory .
polymer init
Depois de executar o comando acima, ele mostrará algo assim -
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 - Selecione a aplicação de polímero 2 entre as opções fornecidas acima.
Agora, inicie seu projeto usando o seguinte comando.
polymer serve
Instalando Polymer usando Bower
Step 1 - Para começar do zero usando o método Bower, instale o Bower usando o seguinte comando.
npm install -g bower
Step 2 - Instale o Polymer usando o seguinte comando.
npm install -g polymer-cli@next
Step 3 - Verifique o sucesso da instalação e versão do Polymer, usando o seguinte comando.
polymer --version
Se tiver sido instalado com sucesso, ele mostrará a versão como -
0.18.0-pre.13.
Step 4 - Para instalar a versão mais recente do Polymer 2.0 RC do bower, use o seguinte comando.
bower install Polymer/polymer#^2.0.0-rc.3
Step 5 - Crie um index.html arquivo e adicione o seguinte código na tag <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 - Inicie seu projeto usando o seguinte comando.
polymer serve
Edifício para implantação
Para construir seu projeto para implantação, polymer build command é uma maneira mais fácil, que irá minimizar, compilar ou agrupar seu código dependendo dos sinalizadores de linha de comando.
Para criar uma versão universal que funcione em todos os navegadores, use o seguinte comando.
polymer build --js-compile
O comando acima irá construir o projeto para construir / default e você pode iniciar este diretório, usando o seguinte comando.
polymer serve build/default
O Polymer 2.0 usa ES6 e HTML Custom Elements. Para melhores práticas, é sempre bom usar ES6 para navegadores com suporte ES6 completo e compilar ES5 para navegadores antigos que não suportam ES6. A tabela a seguir mostra a melhor estratégia para seu projeto.
Estratégia | Mais fácil para suporte cruzado | Mais ideal para desempenho WC v1 |
---|---|---|
Servidor | Qualquer servidor funciona, incluindo os estáticos | Serviço diferencial necessário |
Código implantado | ES5 transpilado | ES6 |
Polyfill Loader | webcomponents-es5-loader.js | webcomponents-loader.js |