or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

build-system.mdcli-reference.mdconfiguration.mddevelopment-server.mdindex.mdplugins.mdpreview-mode.mdtype-definitions.mdutilities.md
tile.json

plugins.mddocs/

Plugins

Specialized plugins for Electron development including bytecode compilation for source protection, automatic dependency externalization, and SWC transformer support for TypeScript decorators.

Capabilities

Bytecode Plugin

Compile JavaScript to V8 bytecode for source code protection in production builds.

/**
 * Compile to v8 bytecode to protect source code
 * @param options - Bytecode compilation options
 * @returns Vite plugin or null if not in production
 */
function bytecodePlugin(options?: BytecodeOptions): Plugin | null;

interface BytecodeOptions {
  /** Chunk names to compile to bytecode, empty array compiles all chunks */
  chunkAlias?: string | string[];
  /** Transform arrow functions to regular functions for compatibility */
  transformArrowFunctions?: boolean;
  /** Remove original JS bundle files after compilation */
  removeBundleJS?: boolean;
  /** Strings to protect by converting to String.fromCharCode calls */
  protectedStrings?: string[];
}

Usage Examples:

import { defineConfig } from "electron-vite";
import { bytecodePlugin } from "electron-vite";

export default defineConfig({
  main: {
    plugins: [
      bytecodePlugin({
        chunkAlias: ['main'], // Only compile main chunk
        transformArrowFunctions: true,
        removeBundleJS: true,
        protectedStrings: ['secretKey', 'apiToken']
      })
    ]
  }
});

Dependencies Externalization Plugin

Automatically externalize dependencies to reduce bundle size and improve build performance.

/**
 * Automatically externalize dependencies
 * @param options - Externalization options
 * @returns Vite plugin or null if no dependencies found
 */
function externalizeDepsPlugin(options?: ExternalOptions): Plugin | null;

interface ExternalOptions {
  /** Dependencies to exclude from externalization */
  exclude?: string[];
  /** Additional dependencies to include in externalization */
  include?: string[];
}

Usage Examples:

import { defineConfig } from "electron-vite";
import { externalizeDepsPlugin } from "electron-vite";

export default defineConfig({
  main: {
    plugins: [
      externalizeDepsPlugin({
        exclude: ['lodash'], // Keep lodash bundled
        include: ['custom-native-module'] // Externalize custom module
      })
    ]
  },
  preload: {
    plugins: [
      externalizeDepsPlugin() // Externalize all dependencies
    ]
  }
});

SWC Plugin

Use SWC transformer for fast TypeScript compilation with decorator support.

/**
 * Use SWC to support for emitting type metadata for decorators
 * When using swcPlugin, you need to install @swc/core
 * @param options - SWC transformation options
 * @returns Vite plugin
 */
function swcPlugin(options?: SwcOptions): Plugin;

interface SwcOptions {
  /** Files to include in transformation */
  include?: FilterPattern;
  /** Files to exclude from transformation */
  exclude?: FilterPattern;
  /** SWC transformation configuration */
  transformOptions?: TransformConfig;
}

// From Vite
type FilterPattern = string | RegExp | (string | RegExp)[] | null;

// From @swc/core
interface TransformConfig {
  jsc?: JscConfig;
  module?: ModuleConfig;
  isModule?: boolean;
}

interface JscConfig {
  parser?: ParserConfig;
  transform?: TransformConfig;
  target?: string;
  keepClassNames?: boolean;
  minify?: boolean;
}

Usage Examples:

import { defineConfig } from "electron-vite";
import { swcPlugin } from "electron-vite";

export default defineConfig({
  main: {
    plugins: [
      swcPlugin({
        include: /\.(m?ts|[jt]sx)$/,
        exclude: /\.js$/,
        transformOptions: {
          jsc: {
            parser: {
              syntax: 'typescript',
              decorators: true
            },
            transform: {
              legacyDecorator: true,
              decoratorMetadata: true
            },
            target: 'es2022'
          }
        }
      })
    ]
  }
});

Plugin Features

Bytecode Plugin Features

Source Protection:

  • Compiles JavaScript to V8 bytecode for obfuscation
  • Removes original source code from final build
  • Supports string protection for sensitive data

Compatibility:

  • Automatically transforms arrow functions for bytecode compatibility
  • Handles CommonJS modules only (ES modules not supported)
  • Requires Node.js environment (not for renderer process)

Usage Restrictions:

  • Only works in production builds
  • Cannot be used with ES modules
  • Not compatible with renderer process
  • Does not work with minification enabled for string protection

Externalization Plugin Features

Automatic Detection:

  • Reads dependencies from package.json
  • Creates external patterns for sub-imports
  • Handles scoped packages correctly

Bundle Optimization:

  • Reduces bundle size by excluding dependencies
  • Improves build performance
  • Maintains runtime dependency resolution

Flexible Configuration:

  • Include/exclude specific dependencies
  • Works with both dependencies and devDependencies
  • Supports custom external patterns

SWC Plugin Features

Performance:

  • Faster TypeScript compilation than esbuild/tsc
  • Parallel processing support
  • Efficient transformation pipeline

Decorator Support:

  • Legacy decorator syntax support
  • Type metadata emission for reflection
  • Compatible with frameworks requiring decorators

Configuration:

  • Flexible file pattern matching
  • Custom transformation options
  • Integration with Vite's build pipeline

Plugin Integration

Plugin Order

Recommended plugin order for optimal results:

export default defineConfig({
  main: {
    plugins: [
      // External dependencies first
      externalizeDepsPlugin(),
      
      // SWC transformation 
      swcPlugin(),
      
      // Bytecode compilation last (post-build)
      bytecodePlugin()
    ]
  }
});

Environment-Specific Plugins

Configure plugins based on environment:

export default defineConfig(({ command, mode }) => {
  const plugins = [externalizeDepsPlugin()];
  
  if (mode === 'production') {
    plugins.push(bytecodePlugin());
  }
  
  if (mode === 'development') {
    plugins.push(swcPlugin({ /* dev options */ }));
  }
  
  return {
    main: { plugins }
  };
});

Plugin Dependencies

SWC Plugin Requirements:

npm install @swc/core --save-dev

Bytecode Plugin Requirements:

  • Electron runtime (uses Electron's V8 engine)
  • Node.js environment (main/preload processes only)

Error Handling

Common Plugin Errors

Bytecode Plugin:

  • ES module format not supported
  • Renderer process usage not allowed
  • Missing Electron runtime

SWC Plugin:

  • Missing @swc/core dependency
  • Invalid TypeScript syntax
  • Decorator configuration issues

Externalization Plugin:

  • Missing package.json
  • Invalid dependency specifications
  • Circular dependency issues

Plugin Debugging

Enable plugin debugging with environment variables:

# Debug plugin execution
DEBUG=vite:* electron-vite build

# SWC-specific debugging
SWC_DEBUG=1 electron-vite build