OC Vite Compiler

6.0.0 verified Mon Apr 27 auth: no javascript

OC-Vite-Compiler is an OC (OpenComponents) module that compiles view and server code using Vite. Version 6.0.0 is the latest stable release, with a focus on providing fast builds and HMR for OC components. It integrates Vite's bundling capabilities into the OC ecosystem, enabling ESM and TypeScript support. The package ships TypeScript types and is part of the OpenComponents toolchain. Release cadence is sporadic, tied to OC updates. Key differentiator: leverages Vite for modern, fast development experience versus traditional webpack-based compilers.

Common errors

error require() of ES Module /path/to/oc-vite-compiler/index.js from /path/to/project/index.js not supported. ↓

cause Package is ESM-only, cannot be used with require().

fix

Use import statement or dynamic import() in ESM context.

error Cannot find module 'oc-vite-compiler/legacy' ↓

cause Legacy path removed in v6.

fix

Use default import from 'oc-vite-compiler'.

error TypeError: compiler is not a function ↓

cause Importing default incorrectly (e.g., using ViteCompiler named export as default).

fix

Use 'import compiler from 'oc-vite-compiler'' for default export.

Warnings

breaking v6 drops support for Node.js < 16. ↓

fix Upgrade Node.js to 16+.

breaking v6 changed default export from object to function. ↓

fix Update from import compiler from 'oc-vite-compiler/legacy' to new API.

deprecated Using 'oc-vite-compiler/legacy' path is deprecated since v6. ↓

fix Use default export directly from 'oc-vite-compiler'.

gotcha Vite config must not include 'root' or 'build.outDir' as they are overridden. ↓

fix Remove 'root' and 'build.outDir' from viteConfig option.

gotcha ESM-only package: cannot be required() in CommonJS modules. ↓

fix Use dynamic import() or switch to ESM.

Install

npm install oc-vite-compiler

yarn add oc-vite-compiler

pnpm add oc-vite-compiler

Imports

default

wrong

const compiler = require('oc-vite-compiler')

correct

import compiler from 'oc-vite-compiler'

ESM-only package; require() will fail.

ViteCompiler

wrong

import ViteCompiler from 'oc-vite-compiler'

correct

import { ViteCompiler } from 'oc-vite-compiler'

Named export, not default.

type ViteCompilerOptions

wrong

import { ViteCompilerOptions } from 'oc-vite-compiler'

correct

import type { ViteCompilerOptions } from 'oc-vite-compiler'

Type-only export; use import type to avoid runtime overhead.

Quickstart

Demonstrates compiling an OC component using oc-vite-compiler with options for component path, server, and view files.

import compiler from 'oc-vite-compiler';

const options = {
  componentPath: './src/components/my-component',
  server: './src/server.js',
  view: './src/view.js',
  viteConfig: {}
};

export async function compileComponent() {
  try {
    const result = await compiler(options);
    console.log('Compiled successfully:', result.outputPath);
  } catch (error) {
    console.error('Compilation failed:', error);
  }
}

compileComponent();