PHPackages                             femundfilou/kirby-vite - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility &amp; Helpers](/categories/utility)
4. /
5. femundfilou/kirby-vite

ActiveKirby-plugin[Utility &amp; Helpers](/categories/utility)

femundfilou/kirby-vite
======================

Use Vite Frontend Tooling in Kirby.

0.1.1(2y ago)12.7k[1 issues](https://github.com/femundfilou/kirby-vite/issues)MITPHP

Since Oct 19Pushed 2y ago1 watchersCompare

[ Source](https://github.com/femundfilou/kirby-vite)[ Packagist](https://packagist.org/packages/femundfilou/kirby-vite)[ Docs](https://github.com/femundfilou/kirby-vite)[ RSS](/packages/femundfilou-kirby-vite/feed)WikiDiscussions main Synced 1mo ago

READMEChangelogDependencies (3)Versions (4)Used By (0)

Kirby Vite
==========

[](#kirby-vite)

A Kirby CMS Plugin to use scripts and styles generated by [Vite](https://vitejs.dev/).

Why
---

[](#why)

This plugin is built through a personal need to use vite as frontend tooling. While there are some good plugins for the same usecase out there already, I ran in some issues when using svelte components. My build output consisted of multiple javascript and stylesheet files deriving from differnent svelte components. While the javascript import is handled internally, the css entries would not be rendered. That's why this plugin has a built in method to generate link tags for all non-entry styleheets coming from vite.

Popular other plugins
---------------------

[](#popular-other-plugins)

There are some other plugins for the same use case, have a look at them.

- [**arnoson/kirby-vite**](https://github.com/arnoson/kirby-vite)
- [**johannschopplich/kirby-vite**](https://github.com/johannschopplich/kirby-vite)

Installation
------------

[](#installation)

```
composer require femundfilou/kirby-vite
```

Setup
-----

[](#setup)

This plugin comes with two helper functions to render your assets.

```
DOCTYPE html>

  ...

```

Options + Defaults
------------------

[](#options--defaults)

This plugin is meant to be used with [laravel valet](https://laravel.com/docs/9.x/valet), a really nice local development tool, hence the default server adress. You can of course change it to your liking, but is must be the same setting as in your `vite.config.js`.

If you use valet, you can add a proxy to your typical `localhost:3000` to get a universal vite domain with ssl like so `valet proxy vite http://localhost:3000 --secure`

### Default configuration

[](#default-configuration)

You can override this in your `site/config.php`.

```
return [
  'femundfilou.vite' => [
    'main' => "frontend/index.ts", // Main vite entry
    'manifest' => 'manifest.json', // Path to manifest, relative from root
    'server' => 'https://vite.test:3000', // Server used in development
    'dev' => false // Toggle development on / off
  ]
];
```

### Automatically switch development &amp; production

[](#automatically-switch-development--production)

My recommended way to switch from `development` to `production` automatically is by a using `.env` variable.

1. Install `vlucas/phpdotenv`

```
composer require vlucas/phpdotenv
```

2. Create `.env` file in root
3. Load `.env` in `index.php`

```
use Dotenv\Dotenv;
$dotenv = Dotenv::createImmutable(__DIR__);
$dotenv->load();
```

4. Use it in `site/config.php`

```
return [
  'femundfilou.vite' => [
    'dev' => $_ENV["MODE"] === "dev"
  ]
];
```

5. Now you need a way to update the `.env` file, e.g. through pipeline or while running `npm`, depending on your system for example like this:

```
{
  "scripts": {
    "dev": "sed -i '' -e 's/production/dev/g' path/to/.env && vite",
    "build": "sed -i '' -e 's/dev/production/g' path/to/.env && vite build"
  }
}
```

Legacy Mode
-----------

[](#legacy-mode)

Currently this plugin only generates `type="module"` scripts, so there is no support for vite legacy mode.

###  Health Score

19

—

LowBetter than 10% of packages

Maintenance0

Infrequent updates — may be unmaintained

Popularity20

Limited adoption so far

Community7

Small or concentrated contributor base

Maturity39

Early-stage or recently created project

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~175 days

Total

3

Last Release

950d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/d5a2de9532e976c5cc83bbb8d76f8489c66fdb0620d079e09556337103af3160?d=identicon)[femundfilou](/maintainers/femundfilou)

---

Top Contributors

[![JuKra00](https://avatars.githubusercontent.com/u/2682834?v=4)](https://github.com/JuKra00 "JuKra00 (4 commits)")

---

Tags

kirby-plugin

###  Code Quality

Code StylePHP CS Fixer

### Embed Badge

![Health badge](/badges/femundfilou-kirby-vite/health.svg)

```
[![Health](https://phpackages.com/badges/femundfilou-kirby-vite/health.svg)](https://phpackages.com/packages/femundfilou-kirby-vite)
```

###  Alternatives

[distantnative/retour-for-kirby

Manage redirects and track 404s right from the Kirby CMS Panel

14689.4k1](/packages/distantnative-retour-for-kirby)[oblik/kirby-link-field

Kirby 4 field for all types of links.

7650.6k2](/packages/oblik-kirby-link-field)[belugadigital/kirby-navigation

Kirby 5 field for hierarchical menus with drag &amp; drop level indentation.

8713.4k](/packages/belugadigital-kirby-navigation)[bnomei/kirby3-dotenv

Kirby Plugin for environment variables from .env

4144.1k1](/packages/bnomei-kirby3-dotenv)[tobimori/kirby-icon-field

A simple Icon field plugin for Kirby CMS

5117.1k1](/packages/tobimori-kirby-icon-field)[tobimori/kirby-tailwind-merge

Tailwind Merge for Kirby CMS

276.3k](/packages/tobimori-kirby-tailwind-merge)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
