Registry / web-framework / lit-element-transpiler

lit-element-transpiler

JSON →
library0.1.0jsnpmunverified

A TypeScript transpiler for LitElement components that inlines imported CSS/SCSS files and transpiles TypeScript decorators (@customElement, @property) to native JavaScript. Currently at version 0.1.0, it targets TypeScript ^3.7.0 to < ^3.8.2. It differentiates by automating style inlining and decorator removal, simplifying LitElement code for production. However, it is pre-release and no longer actively maintained, with a narrow TypeScript version range.

npm install lit-element-transpiler
INSTALL
IMPORT
SIG · LIT-ELEMENT-TRANSP
L
lit-element-transpiler
web-frameworkjavascriptv0.1.0
harness data pending
Install & Compatibility
Where this runs

No compatibility data collected yet for this library.

Code
Verified usage

Verified import paths — ran on the pinned version, not inferred.

transform
import { transform } from 'lit-element-transpiler'
import transform from 'lit-element-transpiler'
Named export; default import does not exist.

Demonstrates basic usage of the transform function: imports a LitElement component, inlines CSS, and transpiles decorators.

import { transform } from 'lit-element-transpiler' const code = ` import { LitElement, html, customElement, property } from 'lit-element' import './hello-world.css' @customElement('hello-world') class HelloWorld extends LitElement { @property() message } ` transform('hello-world.ts', code).then(result => { console.log(result.code) // Output: decorators removed, CSS inlined }).catch(err => console.error(err))
Debug
Known issues
breakingTypeScript peer dependency range is strict: >=3.7.0 <3.8.2; using newer TypeScript versions may break.
fix
Use TypeScript 3.7.x or 3.8.0-3.8.1; avoid 3.8.2+ and 3.9+.
affects: >=0.1.0
deprecatedPackage has not been updated since 2020 and is effectively in maintenance mode; no plans for new features.
fix
Consider alternatives like @open-wc/building-utils or custom-elements-manifest.
affects: >=0.1.0
gotchaThe package does not bundle its own TypeScript; it uses the project's TypeScript, which must match the peer range exactly.
fix
Ensure project TypeScript version is within 3.7.0 and 3.8.1.
affects: >=0.1.0
gotchaCSS/SCSS files must exist on disk at transform time; mock-fs or similar is needed for testing without real files.
fix
Use mock-fs or write files to disk before calling transform.
affects: >=0.1.0
Errors
Common errors & fixes
Error: Cannot find module 'typescript'
TypeScript peer dependency not installed or version mismatch.
fix
Run 'npm install --save-dev typescript@^3.7.0' (within the required range).
TypeError: transform is not a function
Default import used instead of named import.
fix
Use 'import { transform } from 'lit-element-transpiler'' instead of default import.
Error: Cannot find module './hello-world.css'
CSS file not found at the specified path when transform is called.
fix
Ensure the CSS file exists at the expected location or use mock-fs in test environments.
Upgrade
Version history
0.1.0latest on npm
Audit
Dependencies
typescriptrequiredPeer dependency; required for transpilation. Must be >=3.7.0 <3.8.2.
Agent activity
2 hits · last 30 days
node
2
Resources
lit-element-transpiler — npm install lit-element-transpiler · libregistry