PolymerX CLI

Unlock the power of Polymer 3, Web Components and modern web tools.

Features

Generate a Polymer Skeleton for your next project in 30 seconds.

Build using Webpack 4 under the hood producing Service Worker with WorkboxJs.

under the hood producing Service Worker with WorkboxJs. Develop with ease with hot-reload and error layer enabled.

and error layer enabled. Support for PostCSS (with personal configuration) when getting CSS from external files.

https certificate generation on the fly for development.

certificate generation on the fly for development. No magic, just using the tools.

More to come...

Install

NOTE: Node.js >= 8.x required.

$ yarn global add polymerx-cli

Or with NPM

$ npm install -g polymerx-cli

Templates

Official templates are available at https://github.com/Polymerx-skeleton-templates

Usage

$ polymerx create < template-name > < project-name >

IMPORTANT: currently supported only default as template.

Example:

$ polymerx create default my-awesome-project

CLI commands

⚙️ polymerx create

$ polymerx create --help --version Show version number [boolean] --cwd A directory to use instead of $PWD. [default: "."] --name The application's name --author Author of the app [default: null] --force Force option to create the directory for the new app [default: false] --yarn Use 'yarn' instead of 'npm' [boolean] [default: false] --git Initialize version control using git [boolean] [default: false] --https Use HTTPS? [boolean] [default: false] --install Install dependencies [boolean] [default: true]

NOTE: the required data will be asked if not specified.

🕶 polymerx watch

Easy development with hot-reload and "friendly" error layers.

IMPORTANT: postcss configuration file must be present.

$ polymerx watch --help --cwd A directory to use instead of $PWD. [string] [default: .] --src Entry file (index.js) [string] [default: "src"] --config, -c Path to custom polymerx.config.js. [string] [default: null] --port, -p Port to start a server on [string] [default: "8080"] --host, Hostname to start a server on [string] [default: "0.0.0.0"]

NOTE: You can run the dev server on a different port using PORT=8091 polymerx watch

📦 polymerx build

Create a production build with (or without) Service Workers.

IMPORTANT: postcss configuration file must be present.

$ polymerx build --help --cwd A directory to use instead of $PWD. [string] [default: .] --src Entry file (index.js). [string] [default: "src"] --dest Directory root for output. [string] [default: "dist"] --config, -c Path to custom polymerx.config.js. [string] [default: null] --workers, -w Add a service worker to application. [boolean] [default: true] --clean Clear output directory before building. [boolean] [default: true]

Custom Configuration

Webpack

For customizing your webpack configuration create a polymerx.config.js what will exports a function like this:

export default function ( config , env , helpers ) { }

Since we are using the WebpackConfigHelpers by preact-cli you can checkout also their awesome Wiki to get more info about the helper.

About this tool

This CLI is heavily inspired by the awesome preact-cli and aims to became a stable tool for developing Polymer 3 PWA easily and with modern web tools.

License

MIT © LasaleFamine