@closure-next/vite NPM

Closure Next Vite Plugin

Vite integration for Closure Next, providing fast development and optimized builds.

Installation

npm install @closure-next/vite

Usage

// vite.config.ts
import { defineConfig } from 'vite';
import { closureNextVite } from '@closure-next/vite';

export default defineConfig({
  plugins: [
    closureNextVite({
      hmr: true,
      paths: {
        // Custom module resolution
      }
    })
  ]
});

Features

🔌 Plug-and-play integration
⚡️ Lightning-fast HMR
🔧 TypeScript support
🗺️ Custom module resolution
📦 Optimized production builds
🛠️ Development tools

Options

`hmr`

Enable Hot Module Replacement for Closure components.

closureNextVite({
  hmr: true
})

`paths`

Configure custom module resolution paths.

closureNextVite({
  paths: {
    '@components': './src/components'
  }
})

Example Configuration

Development Mode

// vite.config.ts
import { defineConfig } from 'vite';
import { closureNextVite } from '@closure-next/vite';

export default defineConfig({
  mode: 'development',
  plugins: [
    closureNextVite({
      hmr: true,
      paths: {
        '@closure-next': './node_modules/@closure-next'
      }
    })
  ],
  server: {
    hmr: true
  }
});

Production Mode

// vite.config.ts
import { defineConfig } from 'vite';
import { closureNextVite } from '@closure-next/vite';

export default defineConfig({
  mode: 'production',
  plugins: [
    closureNextVite({
      hmr: false
    })
  ],
  build: {
    target: 'esnext',
    minify: 'terser'
  }
});

TypeScript Support

The plugin includes TypeScript definitions:

import { closureNextVite } from '@closure-next/vite';
import type { UserConfig } from 'vite';

const config: UserConfig = {
  plugins: [
    closureNextVite({
      // Type-checked options
    })
  ]
};

Development Features

Hot Module Replacement

The plugin automatically handles HMR for Closure components:

// Your component will automatically reload when changed
import { Component } from '@closure-next/core';

class MyComponent extends Component {
  // Changes here trigger HMR
}