{"library":"polymer-bundler","title":"Polymer Bundler","description":"polymer-bundler is a JavaScript library and command-line tool (CLI) designed for optimizing web component-based projects by processing and packaging project assets into a single output file. Its primary function, integral to the Polymer 1.x and 2.x ecosystems, was to follow HTML Imports, external scripts, and stylesheets, inlining these resources into \"bundles\" to minimize network round-trips and improve initial load times in production environments. The package is at version 4.0.10. While it offers a programmatic API for custom bundling strategies, it was most commonly used via the Polymer CLI. However, its core utility is significantly diminished as HTML Imports, the foundational web standard it built upon, were deprecated in Chrome M70 and removed entirely in Chrome M80 (February 2020) due to lack of adoption across browsers and the rise of ES Modules. Therefore, while the package exists, its practical application for modern web development is largely obsolete.","language":"javascript","status":"abandoned","last_verified":"Thu Apr 23","install":{"commands":["npm install polymer-bundler"],"cli":null},"imports":["import { Bundler } from 'polymer-bundler';","import { generateManifest } from 'polymer-bundler';","import type { BundleResult } from 'polymer-bundler';"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"npm install -g polymer-bundler\n\n# Create a simple HTML file to bundle\necho '<!DOCTYPE html>\\n<html>\\n<head>\\n  <title>Test App</title>\\n  <link rel=\"import\" href=\"./my-component.html\">\\n  <style>body { font-family: sans-serif; }</style>\\n  <script src=\"./app.js\"></script>\\n</head>\\n<body>\\n  <my-component></my-component>\\n</body>\\n</html>' > index.html\n\necho '<dom-module id=\"my-component\">\\n  <template>\\n    <style>h1 { color: blue; }</style>\\n    <h1>Hello from My Component!</h1>\\n  </template>\\n  <script>class MyComponent extends HTMLElement { constructor() { super(); this.attachShadow({mode: \"open\"}).appendChild(document.getElementById(\"my-component\").content.cloneNode(true)); } } customElements.define(\"my-component\", MyComponent);</script>\\n</dom-module>' > my-component.html\n\necho 'console.log(\"App loaded!\");' > app.js\n\n# Bundle the application, inlining scripts and styles, and stripping comments\npolymer-bundler index.html \\\n  --inline-scripts \\\n  --inline-css \\\n  --strip-comments \\\n  --out-file bundled-app.html\n\n# To view the output:\n# cat bundled-app.html","lang":"bash","description":"This quickstart demonstrates installing `polymer-bundler` globally and using it via the CLI to bundle a simple HTML application with a custom element and external resources. It inlines all scripts and styles, strips comments, and outputs to `bundled-app.html`.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}