Vite plugin for DLight.js

0.9.20 verified Fri May 01 auth: no javascript

A Vite plugin that transpiles DLight.js component syntax (JSX-like DSL) into standard JavaScript, enabling fast HMR and bundling for DLight applications. Current stable version 0.9.20 is in active development with weekly releases. Key differentiator: seamlessly integrates DLight's reactive UI framework with Vite's fast dev server and optimized builds. Requires DLight runtime and Babel transforms.

Common errors

error Error: Cannot find module 'vite-plugin-dlight-client' ↓

cause Package not installed or incorrect import path.

fix

npm install vite-plugin-dlight-client --save-dev

error TypeError: dlightPlugin is not a function ↓

cause Default import used incorrectly (e.g., named import instead of default).

fix

Use import dlightPlugin from 'vite-plugin-dlight-client' (default import).

Warnings

breaking ESM-only: package does not support CommonJS require() ↓

fix Use ES import syntax or import() for dynamic import.

deprecated Option 'files' is deprecated; use 'include' and 'exclude' patterns instead. ↓

fix Replace 'files' with 'include: ["src/**/*.js"]' in plugin options.

gotcha Missing peer dependency: dlight must be installed separately. ↓

fix npm install dlight --save

Install

npm install vite-plugin-dlight-client

yarn add vite-plugin-dlight-client

pnpm add vite-plugin-dlight-client

Imports

default

wrong

const dlightPlugin = require('vite-plugin-dlight-client')

correct

import dlightPlugin from 'vite-plugin-dlight-client'

ESM-only package; CJS require will fail. Use dynamic import if needed.

type DlightOptions
```
import type { DlightOptions } from 'vite-plugin-dlight-client'
```
TypeScript users should use type import for options interface.

Quickstart

Configure Vite with the DLight plugin for transpiling DLight components in your project.

// vite.config.ts
import { defineConfig } from 'vite';
import dlightPlugin from 'vite-plugin-dlight-client';

export default defineConfig({
  plugins: [
    dlightPlugin({
      // Optional: configure transpilation options
      // files: 'src/**/*.js',
      // parser: 'babel',
    })
  ]
});