Bundle.js Examples

Minimal Build Setup

Basic configuration for a modern JavaScript project with zero dependencies.

bundle.config.js


export default {
  input: './src/index.js',
  output: {
    dir: './dist',
    format: 'esm'
  },
  plugins: []
}

TypeScript Integration

Bundle.js automatically handles TypeScript without explicit plugin configuration.

src/index.ts


// Type-safe configuration in TypeScript
export default {
  input: './src/main.ts',
  output: {
    file: 'bundle.js',
    format: 'umd'
  },
  plugins: []
}

Bundled React App

Auto-bundle React components with JSX support and hot module replacement.

src/App.jsx


import React from 'react';

function App() {
  return (
    <div>
      <h1>Hello from Bundle.js!</h1>
    </div>
  );
}

export default App;

Code Splitting

Automatically split code into multiple chunks for better load performance.

bundle.config.js


export default {
  input: './src/index.js',
  output: {
    dir: './dist',
    format: 'esm',
    chunkFileNames: 'chunks/[name].[hash].js'
  },
  plugins: [],
  splitting: true
}

Bundle.js - Example Showcase

Interactive Examples

Minimal Build Setup

TypeScript Integration

Bundled React App

Code Splitting

Want to try it yourself?