https://github.com/bildpunkt/vite-plugin-kss

Plugin to integrate KSS into the Vite bundling process
https://github.com/bildpunkt/vite-plugin-kss

kss-node vite vite-plugin

Last synced: 4 months ago
JSON representation

Plugin to integrate KSS into the Vite bundling process

• Host: GitHub
• URL: https://github.com/bildpunkt/vite-plugin-kss
• Owner: bildpunkt
• License: mit
• Archived: true
• Created: 2023-06-08T17:14:51.000Z (about 3 years ago)
• Default Branch: main
• Last Pushed: 2025-07-26T00:54:27.000Z (11 months ago)
• Last Synced: 2026-01-13T07:46:13.109Z (6 months ago)
• Topics: kss-node, vite, vite-plugin
• Language: TypeScript
• Homepage:
• Size: 736 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE

Awesome Lists containing this project

README

          
# vite-plugin-kss

Plugin to integrate KSS (specifically [kss-node](https://github.com/kss-node/kss-node)) into the Vite bundling process.

## Setup

### Installation

```shell

npm i --save-dev vite-plugin-kss

```

### Configuration

Add `ViteKSS` plugin to your `vite.config.{js,ts}` and configure it:

```js

import { ViteKSS } from 'vite-plugin-kss'

export default {

  plugins: [

    ViteKSS({

      dev: {

        // base of the KSS output being available on the Vite dev server

        base: '/prototype/',

        // entry script file (for injection into KSS)

        entry: '/src/main.js',

      },

      kss: {

        // any of the kss-node options can go here

        // reference: https://github.com/kss-node/kss-node#using-the-command-line-tool

        // the important ones you should set are:

        // - source

        // - destination

      },

    }),

  ],

}

```

### Usage

With the plugin configured, KSS generation is now done when running both `vite build` or `vite dev`/`vite serve`.

When doing a production build with `vite build` the plugin automatically collects all JS entrypoints and CSS assets, also outputs them to the configured KSS destination and includes them in the build configuration so they are rendered into the HTML output.

If a development server is running using `vite dev`/`vite serve`, KSS is available at `localhost:5173/prototype/` (or the configured `dev.base` location). The plugin automatically injects the Vite client and entrypoint (configured in `dev.entry`) so HMR and all assets work properly.

## License

This project is licensed under the [MIT License](./LICENSE)