{"id":25896,"library":"lit-swc-transpiler","title":"lit-swc-transpiler","description":"A fast SWC-based transpiler for LitElement and other custom elements. Version 1.0.0 focuses on converting decorator and template syntax to standard JavaScript with minimal overhead. Ships TypeScript types for better DX. Compared to Babel-based alternatives, it leverages SWC's Rust core for up to 20x faster compilation. Ideal for large web component projects and build pipelines. Currently in early release, no stable release cadence yet.","status":"active","version":"1.0.0","language":"javascript","source_language":"en","source_url":null,"tags":["javascript","swc","transpiler","lit","lit-element","custom-elements","web-components","typescript"],"install":[{"cmd":"npm install lit-swc-transpiler","lang":"bash","label":"npm"},{"cmd":"yarn add lit-swc-transpiler","lang":"bash","label":"yarn"},{"cmd":"pnpm add lit-swc-transpiler","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Core SWC compiler engine for transpilation","package":"@swc/core","optional":false},{"reason":"Runtime for LitElement decorators and templates","package":"lit","optional":false}],"imports":[{"note":"Library is ESM-only; CommonJS require is not supported.","wrong":"const { transpile } = require('lit-swc-transpiler')","symbol":"transpile","correct":"import { transpile } from 'lit-swc-transpiler'"},{"note":"Type import only; runtime use will cause error.","wrong":"import { TransformOptions } from 'lit-swc-transpiler'","symbol":"TransformOptions","correct":"import type { TransformOptions } from 'lit-swc-transpiler'"},{"note":"Synchronous version of transpile; use only in build scripts.","wrong":null,"symbol":"transformSync","correct":"import { transformSync } from 'lit-swc-transpiler'"}],"quickstart":{"code":"import { transpile } from 'lit-swc-transpiler';\n\nconst code = `\nimport { LitElement, html, css } from 'lit';\n\nclass MyElement extends LitElement {\n  static styles = css\\`p { color: red; }\\`;\n  \n  @property()\n  name = 'World';\n  \n  render() {\n    return html\\`<p>Hello, \\${this.name}!</p>\\`;\n  }\n}\n\ncustomElements.define('my-element', MyElement);\n`;\n\nconst result = transpile(code, {\n  filename: 'my-element.ts',\n  decorators: true,\n  ts: true\n});\n\nconsole.log(result.code);","lang":"typescript","description":"Shows basic usage: transpile a LitElement with decorators and TypeScript, outputting standard JS."},"warnings":[{"fix":"Enable TypeScript mode by setting `ts: true` option, or pre-process with a decorator transformer.","message":"Decorator syntax is only supported in TypeScript mode; plain JavaScript files cannot use decorators without a separate parser.","severity":"breaking","affected_versions":">=1.0.0"},{"fix":"Use `transpile` instead. `transform` will be removed in v2.","message":"The `transform` function is deprecated in favor of `transpile`.","severity":"deprecated","affected_versions":">=1.0.0"},{"fix":"Add `import { css } from 'lit';` in your source files.","message":"The library does not handle `css` tagged template literal polyfills; ensure Lit's `css` helper is imported.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Pass `sourceMaps: true` in options to get inline source maps.","message":"Source maps are not generated by default; enable with `sourceMaps: true` option.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-05-01T00:00:00.000Z","next_check":"2026-07-30T00:00:00.000Z","problems":[{"fix":"Run `npm install lit-swc-transpiler` and ensure import path is correct.","cause":"Package not installed or wrong import path.","error":"Error: Cannot find module 'lit-swc-transpiler'"},{"fix":"Change `const { transpile } = require('lit-swc-transpiler')` to `import { transpile } from 'lit-swc-transpiler'`.","cause":"Using CommonJS require instead of ESM import.","error":"TypeError: transpile is not a function"},{"fix":"Either rename file to .ts or pass `ts: true` in options.","cause":"Decorator syntax in a file not recognized as TypeScript.","error":"SyntaxError: Unexpected token (5:10) - Decorators are not valid here."}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}