Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/apursley2012/v-doom/llms.txt

Use this file to discover all available pages before exploring further.

Candle.js is not a visible component. It contains no UI, renders nothing to the DOM, and has no props. It is the Vite/Rollup shared chunk that bundles React and the JSX transform runtime into a single file that every other component chunk imports from. You will never reference it directly when customizing v-doom.
The name “Candle” is an auto-generated Rollup chunk name based on the module content. It has nothing to do with candles or flames in the UI — the name is a build artifact.

What It Contains

Candle.js exposes three named exports derived from the React packages:

r

React CJS module (react package, v18.3.1). The core library — useState, useEffect, useRef, useCallback, and all other hooks live here.

R

React namespace object — a frozen ESM namespace wrapper around the same React CJS module. Used internally by bundled packages (such as the React Router and React DOM code inside Navigation.js) that need a module-namespace reference to React.

j

JSX runtime (react/jsx-runtime). The automatic JSX transform target — jsx() and jsxs() — used by every component that renders JSX.
ReactDOM is not exported from Candle.js. It is bundled directly inside Navigation.js, which is the only chunk that mounts the React root and calls ReactDOM.render.

Import aliases used across v-doom

All other component files import from Candle.js using short single-character aliases chosen by the Rollup minifier:
// Real example from Navigation.js (also imports R for the React namespace):
import { r as x, R as gc, j as je } from './Candle.js';

// Real example from Layout.js / RuneCircle.js / ParticleBackground.js
// (only need React hooks + jsx, so R is not imported):
import { r as c, j as d } from './Candle.js';
The aliases differ between chunks because Rollup assigns them independently during minification, but they always resolve to the same three exports from Candle.js.

Why It Exists

When Vite builds v-doom for production, Rollup analyses the dependency graph and notices that React is imported by every component. Instead of embedding a copy of React inside each output chunk (which would bloat the bundle), Rollup hoists React into a single shared chunk — Candle.js — and rewrites all component imports to reference it. This pattern provides two advantages:
1

No duplicate code

React’s ~130 KB of minified source appears exactly once in the build output, regardless of how many components import it.
2

Browser module preloading

The browser can preload Candle.js in parallel with the page’s HTML before any component chunk is evaluated, reducing time-to-interactive.

The Name

Rollup names auto-generated shared chunks after a representative export or module found inside them. In v-doom’s build, the chunk happened to be named Candle — likely derived from an internal symbol name during the minification pass. The name carries no semantic meaning within the project.
If you fork v-doom and run a fresh production build (vite build), Rollup will regenerate this chunk. It may receive a different auto-generated name, and the single-character import aliases inside other chunk files will also be reassigned. This is normal and expected.

How It’s Used (Reference)

You will never write an import from Candle.js yourself. The following is shown purely for transparency when reading the minified source files:
// How component source files reference React after the build:
import { r as React, j as jsx } from './Candle.js';

// Equivalent un-minified source you write in development:
import React from 'react';
import { jsx } from 'react/jsx-runtime';
Never manually edit Candle.js. It is a generated build artifact — any changes will be overwritten the next time vite build runs. If you need to upgrade React, update the version in package.json and rebuild.

Build docs developers (and LLMs) love