egoist/vite-plugin-compile-time

Some compile-time magic for your Vite project

💛 You can help the author become a full-time open-source maintainer by sponsoring him on GitHub.

---

vite-plugin-compile-time

Use this plugin to generate code at compile time or get data at compile time in your Vite projects.

Install

npm i vite-plugin-compile-time -D

In vite.config.ts:

import { defineConfig } from "vite"
import compileTime from "vite-plugin-compile-time"

export default defineConfig({
  plugins: [compileTime()],
})

In tsconfig.json:

{
  "compilerOptions": {
    // ...
    "types": [
       // ...,
      "vite-plugin-compile-time/client"
    ]
  }
}

Usage

Compile-time data:

// get-data.ts
import fs from "fs"

export default async () => {
  const post = await fs.promises.readFile("./post.md", "utf8")
  return {
    data: { post },
  }
}

// get the data at compile time
const data = import.meta.compileTime("./get-data.ts")
assert.deepEqual(data, { post: "....." })

Compile-time code:

// generate-code.ts
export default async () => {
  return {
    code: `count++`,
  }
}

// insert the generated code at compile time
let count = 0
import.meta.compileTime("./generate-code.ts")
assert.equal(count, 1)

API

Use import.meta.compileTime to get compile-time data or code.

declare interface ImportMeta {
  compileTime: <T>(file: string) => T
}

You should return a default export with object containing code or data property:

import {
  CompileTimeFunctionArgs,
  CompileTimeFunctionResult,
} from "vite-plugin-compile-time"

export default async (
  args: CompileTimeFunctionArgs,
): CompileTimeFunctionResult => {
  return {
    data: {
      hello: "world",
    },
    // Trigger rebuild when watched files change
    watchFiles: ["/absolute/path"],
  }
}

See the type docs on paka.dev.

Sponsors

License

MIT © EGOIST