Open Web Components provides a set of defaults, recommendations and tools to help facilitate your web component project. Our recommendations include: developing, linting, testing, building, tooling, demoing, publishing and automating.

Usage

npm i -g yo
npm i -g generator-open-wc

# scaffold a complete new component
mkdir my-element
cd my-element
# Default development recommendation
yo open-wc:scaffold-vanilla

# upgrade/align your existing web component with 'open-wc' recommendations
cd existing-web-component
yo open-wc

Homepage

For more details please visit us at open-wc.org.

Packages

Package	Version	Description
testing-helpers		Testing Helpers following open-wc recommendations.
chai-dom-equals		Chai Plugin to compare dom and shadow dom trees. Part of open-wc recommendations.
semantic-dom-diff		To compare dom and shadow dom trees. Part of open-wc recommendations.
testing		Testing following open-wc recommendations.
testing-karma		Testing with Karma following open-wc recommendations.
testing-karma-bs		Testing with Karma using Browserstack following open-wc recommendations.
webpack-import-meta-loader		Webpack loader plugin to support import.meta.
generator-open-wc		Scaffold web components following open-wc recommendations.
polyfills-loader		Load web component polyfills using dynamic imports.
eslint-config		Eslint configuration following open-wc recommendations.
testing-wallaby		Testing with wallaby following open-wc recommendations.
prettier-config		Prettier configuration following open-wc recommendations.
building-webpack		Default configuration for working with webpack.
storybook		Storybook configuration following open-wc recommendations.
owc-dev-server		Development server for modern web apps.

Contact

Feel free to reach out to us on twitter or create a github issue for any feedback or questions you might have.

You can also find us on the Polymer slack in the #open-wc channel.

You can join the Polymer slack by visiting this link.

We Proudly Use

Guide

# bootstrap/setup
npm run bootstrap

# linting
npm run lint

# local testing
npm run test

# testing via browserstack
npm run test:bs

# run commands only for a specific scope
lerna run <command> --scope @open-wc/<package-name> --stream