LogoPixi’VN
viteFunctions

Function: noHmrInkPlugin()

> noHmrInkPlugin(options?): Plugin

Defined in: src/vite/plugins.ts:464

Creates a Vite plugin that:

  • Prevents Hot Module Replacement (HMR) for .ink files and instead sends an ink-updated custom event to the client so that setupInkHmrListener can reload the story.
  • Transforms .ink files so they can be imported as plain strings.
  • Optionally generates a virtual module virtual:pixi-vn-ink (when VitePluginInkOptions.inkGlob is provided) that exports all matched ink file contents as a string[], removing the need to write a manual glob-import helper.
  • Optionally exports the same matched .ink files as .json to a configurable location (when VitePluginInkOptions.inkJsonOutputPattern is provided), together with a manifest.json file for bulk runtime loading with importPixiVNJson.

Parameters

options?

VitePluginInkOptions

Optional plugin configuration.

Returns

Plugin

A Vite plugin.

See

https://pixi-vn.com/ink#vite-plugin

Examples

vite.config.ts
// vite.config.ts – without inkGlob (manual loading)
import { defineConfig } from "vite";
import { vitePluginInk } from "@drincs/pixi-vn-ink/vite";

export default defineConfig({
  plugins: [vitePluginInk()],
});
vite.config.ts
// vite.config.ts – with inkGlob (automatic loading via virtual module)
import { defineConfig } from "vite";
import { vitePluginInk } from "@drincs/pixi-vn-ink/vite";

export default defineConfig({
  plugins: [vitePluginInk({ inkGlob: "./ink/**/*.ink" })],
});
main.ts
// main.ts
import { importInkText } from "@drincs/pixi-vn-ink";
import { setupInkHmrListener } from "@drincs/pixi-vn-ink/vite-listener";
import inkTexts from "virtual:pixi-vn-ink";

await importInkText(inkTexts);
setupInkHmrListener();
vite.config.ts
// vite.config.ts – generate JSON files in public/ink-json too
import { defineConfig } from "vite";
import { vitePluginInk } from "@drincs/pixi-vn-ink/vite";

export default defineConfig({
  plugins: [
    vitePluginInk({
      inkGlob: "./ink/**/*.ink",
      inkJsonOutputPattern: "./public/ink-json/[path][name].json",
    }),
  ],
});
main.ts
// Bulk-load the generated JSON files at runtime
import { importPixiVNJson } from "@drincs/pixi-vn-json/interpreter";

const manifest = (await fetch("/ink-json/manifest.json").then((response) =>
  response.json(),
)) as string[];

const stories = await Promise.all(
  manifest.map((url) => fetch(url).then((response) => response.json())),
);

await Promise.all(stories.map((story) => importPixiVNJson(story)));

On this page