Команды CLI и их назначение

Polymer CLI — инструмент командной строки, обеспечивающий создание, сборку и тестирование проектов на основе Polymer. Установка производится через пакетный менеджер npm:

npm install -g polymer-cli

После установки доступна команда polymer, которая является основным интерфейсом для работы с проектами. Проверить корректность установки можно командой:

polymer --version

Настройка CLI может включать конфигурацию прокси, выбор директорий для сборки и настройку шаблонов проекта.

Создание нового проекта

Создание нового проекта осуществляется командой:

polymer init

CLI предложит выбрать шаблон проекта:

  • polymer-3-starter-kit — современный проект с поддержкой ES6-модулей.
  • polymer-2-starter-kit — устаревшая версия для проектов на Polymer 2.
  • custom element — шаблон для отдельного веб-компонента.

При выборе шаблона CLI создаёт структуру проекта с базовыми файлами: index.html, src/, bower.json (для Polymer 2) или package.json (для Polymer 3), а также конфигурационные файлы.

Локальный сервер разработки

Для быстрой проверки работы компонентов используется команда:

polymer serve

Параметры команды:

  • --port <номер> — указание порта сервера.
  • --open — автоматическое открытие браузера.
  • --hostname <адрес> — определение хоста, по которому доступен сервер.

Сервер поддерживает live reload, что позволяет автоматически обновлять страницу при изменении исходного кода.

Сборка проекта

Сборка проекта на Polymer выполняется командой:

polymer build

В процессе сборки выполняются следующие задачи:

  • Минификация HTML, CSS и JavaScript.
  • Упаковка модулей и оптимизация зависимостей.
  • Генерация production-ready версии проекта в папке build/.

Дополнительные параметры:

  • --bundle — объединение модулей в один файл.
  • --js-compile — компиляция ES6 в ES5 для поддержки старых браузеров.
  • --add-service-worker — генерация Service Worker для кэширования ресурсов.

Проверка проекта и тестирование

Для запуска тестов используется команда:

polymer test

CLI интегрируется с Karma и Web Component Tester (WCT). Параметры включают:

  • --local — запуск тестов локально.
  • --remote — выполнение тестов в удалённых браузерах через Sauce Labs.
  • --plugins — подключение дополнительных плагинов для тестирования.

Анализ и оптимизация производительности

Команда polymer analyze позволяет получить детальный отчёт о проекте:

  • Структура компонентов и их зависимости.
  • Используемые свойства, методы и события.
  • Потенциальные проблемы в производительности или совместимости.

CLI генерирует JSON-отчёты и графические диаграммы, что упрощает оптимизацию кода.

Управление зависимостями

Для проектов на Polymer 2 используется bower, а на Polymer 3 — npm. CLI предоставляет команды:

  • polymer install — установка зависимостей.
  • polymer update — обновление библиотек до последних версий.
  • polymer uninstall — удаление пакетов.

Использование CLI обеспечивает согласованность версий и корректное подключение компонентов в проекте.

Генерация веб-компонентов

Создание отдельных компонентов возможно с помощью команды:

polymer create element <имя-компонента>

В результате формируется структура:

  • <имя-компонента>.js — основной скрипт с классом компонента.
  • <имя-компонента>.html — шаблон и стили компонента.
  • Тестовый файл и конфигурации для сборки.

Это ускоряет процесс разработки и стандартизирует структуру проектов.

Дополнительные возможности CLI

Polymer CLI поддерживает ряд вспомогательных команд:

  • polymer lint — проверка кода на ошибки и соблюдение стандартов.
  • polymer serve --npm — использование npm-пакетов вместо Bower.
  • polymer help — вывод справочной информации по всем командам.

Эти возможности делают CLI универсальным инструментом для разработки, тестирования и деплоя приложений на Polymer.

Оглавление