{"id":13451938,"url":"https://github.com/open-wc/open-wc","last_synced_at":"2025-05-13T17:04:48.931Z","repository":{"id":37906229,"uuid":"149014578","full_name":"open-wc/open-wc","owner":"open-wc","description":"Open Web Components: guides, tools and libraries for developing web components.","archived":false,"fork":false,"pushed_at":"2025-03-18T22:27:56.000Z","size":28349,"stargazers_count":2316,"open_issues_count":189,"forks_count":426,"subscribers_count":46,"default_branch":"master","last_synced_at":"2025-05-05T22:57:56.154Z","etag":null,"topics":["hacktoberfest","javascript","lit-element","web-components"],"latest_commit_sha":null,"homepage":"https://open-wc.org/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/open-wc.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null},"funding":{"github":"modernweb-dev","open_collective":"modern-web"}},"created_at":"2018-09-16T16:35:09.000Z","updated_at":"2025-05-03T21:27:59.000Z","dependencies_parsed_at":"2024-01-15T10:29:44.392Z","dependency_job_id":"62c426a0-642f-4100-b4aa-bc315d30d4a6","html_url":"https://github.com/open-wc/open-wc","commit_stats":{"total_commits":2522,"total_committers":249,"mean_commits":10.1285140562249,"dds":0.7700237906423474,"last_synced_commit":"480509899d95c9fbc3f6913b1532a8b599df3002"},"previous_names":[],"tags_count":2751,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/open-wc%2Fopen-wc","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/open-wc%2Fopen-wc/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/open-wc%2Fopen-wc/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/open-wc%2Fopen-wc/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/open-wc","download_url":"https://codeload.github.com/open-wc/open-wc/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252590570,"owners_count":21772936,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["hacktoberfest","javascript","lit-element","web-components"],"created_at":"2024-07-31T07:01:07.490Z","updated_at":"2025-05-05T22:59:53.909Z","avatar_url":"https://github.com/open-wc.png","language":"JavaScript","funding_links":["https://github.com/sponsors/modernweb-dev","https://opencollective.com/modern-web"],"categories":["JavaScript","web-components","hacktoberfest"],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\u003cimg src=\"https://github.com/open-wc/open-wc/blob/master/assets/images/logo.png\" width=\"200\" alt=\"Open-wc Logo\" /\u003e\u003c/p\u003e\n\n# Open Web Component Recommendations\n\nOpen 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.\n\n## Usage\n\n```bash\n# in a new or existing folder:\nnpm init @open-wc\n# requires node 10 \u0026 npm 6 or higher\n```\n\nThis will kickstart a menu guiding you through all available actions.\n\n```\n$ npm init @open-wc\nnpx: installed 30 in 1.762s\n\n        _.,,,,,,,,,._\n     .d''           ``b.       Open Web Components Recommendations\n   .p'      Open       `q.\n .d'    Web Components  `b.    Start or upgrade your web component project with\n .d'                     `b.   ease. All our recommendations at your fingertips.\n ::   .................   ::\n `p.                     .q'   See more details at https://open-wc.org/init/\n  `p.    open-wc.org    .q'\n   `b.     @openWc     .d'\n     `q..            ..,'      Note: you can exit any time with Ctrl+C or Esc\n        '',,,,,,,,,,''\n\n\n? What would you like to do today? › - Use arrow-keys. Return to submit.\n❯   Scaffold a new project\n    Upgrade an existing project\n```\n\n## Homepage\n\nFor more details please visit us at [open-wc.org](https://open-wc.org).\n\n## Packages\n\n| Package                                                                                     | Version                                                                                                                                       | Description                                                              |\n| ------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------ |\n| [building-rollup](./packages/building-rollup)                                               | [![building-rollup](https://img.shields.io/npm/v/@open-wc/building-rollup.svg)](https://www.npmjs.com/package/@open-wc/building-rollup)       | Default configuration for working with rollup.                           |\n| [create](./packages/create)                                                                 | [![create](https://img.shields.io/npm/v/@open-wc/create.svg)](https://www.npmjs.com/package/@open-wc/create)                                  | Scaffold web components following open-wc recommendations.               |\n| [demoing-storybook](./packages/demoing-storybook)                                           | [![demoing-storybook](https://img.shields.io/npm/v/@open-wc/demoing-storybook.svg)](https://www.npmjs.com/package/@open-wc/demoing-storybook) | Storybook configuration following open-wc recommendations.               |\n| [eslint-config](./packages/eslint-config)                                                   | [![eslint-config](https://img.shields.io/npm/v/@open-wc/eslint-config.svg)](https://www.npmjs.com/package/@open-wc/eslint-config)             | Eslint configuration following open-wc recommendations.                  |\n| [@web/dev-server](https://modern-web.dev/docs/dev-server/overview/)                                      | [![@web/dev-server](https://img.shields.io/npm/v/@web/dev-server.svg)](https://www.npmjs.com/package/@web/dev-server)            | Modern development server for web applications, replacing es-dev-server. |\n| [polyfills-loader](./packages/polyfills-loader)                                             | [![polyfills-loader](https://img.shields.io/npm/v/@open-wc/polyfills-loader.svg)](https://www.npmjs.com/package/@open-wc/polyfills-loader)    | Load web component polyfills using dynamic imports.                      |\n| [scoped-elements](./packages/scoped-elements)                                               | [![scoped-elements](https://img.shields.io/npm/v/@open-wc/scoped-elements.svg)](https://www.npmjs.com/package/@open-wc/scoped-elements)       | Auto define custom elements to scope them and avoid the name collision.  |\n| [semantic-dom-diff](./packages/semantic-dom-diff)                                           | [![semantic-dom-diff](https://img.shields.io/npm/v/@open-wc/semantic-dom-diff.svg)](https://www.npmjs.com/package/@open-wc/semantic-dom-diff) | To compare dom and shadow dom trees. Part of open-wc recommendations.    |\n| [testing](./packages/testing)                                                               | [![testing](https://img.shields.io/npm/v/@open-wc/testing.svg)](https://www.npmjs.com/package/@open-wc/testing)                               | Testing following open-wc recommendations.                               |\n| [testing-helpers](./packages/testing-helpers)                                               | [![testing-helpers](https://img.shields.io/npm/v/@open-wc/testing-helpers.svg)](https://www.npmjs.com/package/@open-wc/testing-helpers)       | Testing Helpers following open-wc recommendations.                       |\n| [testing-karma](./packages/testing-karma)                                                   | [![testing-karma](https://img.shields.io/npm/v/@open-wc/testing-karma.svg)](https://www.npmjs.com/package/@open-wc/testing-karma)             | Testing with Karma following open-wc recommendations.                    |\n| [testing-karma-bs](https://github.com/open-wc/legacy/tree/master/packages/testing-karma-bs) | [![testing-karma-bs](https://img.shields.io/npm/v/@open-wc/testing-karma-bs.svg)](https://www.npmjs.com/package/@open-wc/testing-karma-bs)    | Testing with Karma using Browserstack following open-wc recommendations. |\n| [testing-wallaby](./packages/testing-wallaby)                                               | [![testing-wallaby](https://img.shields.io/npm/v/@open-wc/testing-wallaby.svg)](https://www.npmjs.com/package/@open-wc/testing-wallaby)       | Testing with wallaby following open-wc recommendations.                  |\n\n## Contact\n\nFeel free to reach out to us on [𝕏 (Twitter)](https://twitter.com/OpenWc) or create [a github issue](https://github.com/open-wc/open-wc/issues/new) for any feedback or questions you might have.\n\nYou can also find us on the Lit \u0026 Friends slack in the [#open-wc](https://lit-and-friends.slack.com/archives/CE6D9DN05) channel.\n\nYou can join the Lit \u0026 Friends slack by visiting [https://lit.dev/slack-invite/](https://lit.dev/slack-invite/).\n\n## Sponsored by\n\n\u003ca href=\"https://google.com/chrome\" style=\"border: none;\" target=\"_blank\" rel=\"noopener\"\u003e\n  \u003cimg src=\"https://github.com/open-wc/open-wc/blob/master/docs/_assets/supporters/chrome.svg\" width=\"100\" alt=\"Chrome's Web Framework \u0026 Tools Performance Fund Logo\" /\u003e\n\u003c/a\u003e\n\n\u003ca href=\"https://divriots.com/\" style=\"border: none;\" target=\"_blank\" rel=\"noopener\"\u003e\n  \u003cimg src=\"https://github.com/open-wc/open-wc/blob/master/docs/_assets/supporters/divriots-light.svg#gh-light-mode-only\" width=\"200\" alt=\"Divriots Logo\" /\u003e\n\u003c/a\u003e\n\n## Supported by\n\n\u003ca href=\"http://browserstack.com/\" style=\"border: none;\" target=\"_blank\" rel=\"noopener\"\u003e\n  \u003cimg src=\"https://github.com/open-wc/open-wc/blob/master/assets/images/Browserstack-logo.svg\" width=\"200\" alt=\"Browserstack Logo\" /\u003e\n\u003c/a\u003e\n\n\u003ca href=\"http://netlify.com/\" style=\"border: none;\" target=\"_blank\" rel=\"noopener\"\u003e\n  \u003cimg src=\"https://www.netlify.com/v3/img/components/full-logo-light.svg\" width=\"185\" alt=\"netlify logo\" /\u003e\n\u003c/a\u003e\n\n## Guide\n\n```bash\n# bootstrap/setup\nnpm install\n\n# linting\nnpm run lint\n\n# local testing\nnpm run test\n\n# testing via browserstack\nnpm run test:bs\n\n# run commands only for a specific scope\nlerna run \u003ccommand\u003e --scope @open-wc/\u003cpackage-name\u003e --stream\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fopen-wc%2Fopen-wc","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fopen-wc%2Fopen-wc","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fopen-wc%2Fopen-wc/lists"}