@fabithub/vite-plugin-ci4

Vite Plugin for CodeIgniter 4 integration. Inspired by Laravel's Vite Plugin.

Introduction

This Vite plugin allows seamless integration of Vite JS with CodeIgniter 4, providing enhanced development and build processes for your web applications.

Features

• CodeIgniter 4 support for Vite.
• Streamlined development workflow.
• Efficient production builds.

Installation

NPM

npm install --save-dev @fabithub/vite-plugin-ci4

Yarn

yarn add --dev @fabithub/vite-plugin-ci4

PNPM

pnpm add -D @fabithub/vite-plugin-ci4

Bun

bun add -d @fabithub/vite-plugin-ci4

Usage

In your Vite configuration file (usually vite.config.js), add the plugin:

// vite.config.js
import Ci4Plugin from "@fabithub/vite-plugin-ci4";

export default {
  plugins: [Ci4Plugin("resources/index.js")]
};

Configuration

You can customize the plugin by passing options during initialization:

// vite.config.js
import Ci4Plugin from "@fabithub/vite-plugin-ci4";

export default {
  plugins: [
    Ci4Plugin({
      input: ["resources/index.js", "resources/app.css"],
      refresh: true
      /* other configuration here */
    })
  ]
};

Options

| Configuration | Type | Default | Description | | -------------------- | ------------------------------------------------------------- | -------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------- | | input | string / string[] | | The path or paths of the entry points to compile. | | publicDirectory | string | "public" | Project's public directory. | | buildDirectory | string | "build" | The public subdirectory where compiled assets should be written. | | hotFile | string | `${publicDirectory}/hot` | The path to the "hot" file. | | ssr | string / string[] | | The path of the SSR entry point. | | ssrOutputDirectory | string | "writable/ssr" | The directory where the SSR bundle should be written. | | refresh | boolean / string / string[] / RefreshConfig / RefreshConfig[] | false | Configuration for performing full page refresh on blade (or other) file changes. see more | | transformOnServe | (code: string, url: string)=>string | | Transform the code while serving. |

Example

// vite.config.ts
import type { UserConfig } from "vite";
import react from "@vitejs/plugin-react";
import ci4 from "@fabithub/vite-plugin-ci4";
import { defineConfig, loadEnv } from "vite";

export default defineConfig(({ mode }): UserConfig => {
  const env = loadEnv(mode, process.cwd());

  return {
    plugins: [react(), ci4(`${env.VITE_RESOURCES_DIR}/${env.VITE_ENTRY_FILE}`)]
  };
});

TODO

• [x] Basic Tests.
• [ ] Better Documentation.
• [ ] Tests for all files & functions.
• [ ] Many More.

Credits

This plugin is inspired by Laravel's vite-plugin by Laravel.

License

This project is licensed under the MIT License .

This project was created using bun init in bun v1.0.25. Bun is a fast all-in-one JavaScript runtime.