Rolldown

https://rolldown.rs/
Admin
Rust-based bundler for JavaScript with Rollup-compatible API and esbuild feature parity, designed...
Tokens:324,373
Snippets:2,240
Trust Score:8.2
Update:1 day ago
Show doc for...
Tokens:
Raw
### Input modules for execution order precedence example

Source: https://rolldown.rs/in-depth/automatic-code-splitting

Four JavaScript modules: entry.js imports setup and execution, and dynamically imports dyn-entry; setup sets a global; execution logs it; dyn-entry imports execution. This shows the input for the singleton precedence example.

```javascript
// entry.js (included in `input` option)
import './setup.js';
import './execution.js';

import('./dyn-entry.js');

// setup.js
globalThis.value = 'hello, world';

// execution.js
console.log(globalThis.value);

// dyn-entry.js
import './execution.js';
```

--------------------------------

### postBanner: Adding build info example

Source: https://rolldown.rs/reference/Interface.OutputOptions

Shows how to use postBanner to prepend a comment with package name, version, and git hash after minification. Imports package.json and uses execSync to get the git hash.

```javascript
import pkg from './package.json' with { type: 'json' };
import { execSync } from 'node:child_process';

const gitHash = execSync('git rev-parse --short HEAD').toString().trim();

export default {
  output: {
    minify: true,
    postBanner: `/* ${pkg.name}@${pkg.version} (${gitHash}) */`,
  },
};
```

--------------------------------

### Example configuration for name option

Source: https://rolldown.rs/reference/Interface.OutputOptions

Example configuration using the name option with format 'iife'.

```js
export default defineConfig({
  output: {
    format: 'iife',
    name: 'MyBundle',
  }
});
```

--------------------------------

### Install just via yarn

Source: https://rolldown.rs/development-guide/setup-the-project

Install the `just` command runner globally using yarn.

```sh
yarn global add just-install
```

--------------------------------

### Install just via pnpm

Source: https://rolldown.rs/development-guide/setup-the-project

Install the `just` command runner globally using pnpm.

```sh
pnpm --global add just-install
```

--------------------------------

### manualPureFunctions example

Source: https://rolldown.rs/reference/InputOptions.treeshake

Example configuration for manualPureFunctions, listing function names to be considered pure.

```js
treeshake: {
  manualPureFunctions: ['console.log', 'debug.trace']
}
```

--------------------------------

### Entry and shared modules example

Source: https://rolldown.rs/in-depth/automatic-code-splitting

Shows the source files for three entries (entry-a.js, entry-b.js, entry-c.js) and three shared modules (shared-by-ab.js, shared-by-bc.js, shared-by-abc.js) that are statically imported by multiple entries. This setup results in six chunks: three entry chunks and three common chunks.

```javascript
// entry-a.js (included in `input` option)
import 'shared-by-ab.js';
import 'shared-by-abc.js';
console.log(globalThis.value);

// entry-b.js (included in `input` option)
import 'shared-by-ab.js';
import 'shared-by-bc.js';
import 'shared-by-abc.js';
console.log(globalThis.value);

// entry-c.js (included in `input` option)
import 'shared-by-bc.js';
import 'shared-by-abc.js';
console.log(globalThis.value);

// shared-by-ab.js
globalThis.value = globalThis.value || [];
globalThis.value.push('ab');

// shared-by-bc.js
globalThis.value = globalThis.value || [];
globalThis.value.push('bc');

// shared-by-abc.js
globalThis.value = globalThis.value || [];
globalThis.value.push('abc');
```

--------------------------------

### Install heaptrack and heaptrack-gui on Ubuntu

Source: https://rolldown.rs/development-guide/profiling

Installs heaptrack and its GUI using apt. Required for memory profiling on Linux.

```bash
sudo apt install heaptrack heaptrack-gui
```

--------------------------------

### Install just via npm

Source: https://rolldown.rs/development-guide/setup-the-project

Install the `just` command runner globally using npm.

```sh
npm install --global just-install
```

--------------------------------

### Example trace output from oxc_resolver

Source: https://rolldown.rs/development-guide/tracing-logging

Example output from the oxc_resolver trace, showing the resolved options, path, specifier, and return value.

```text
2024-06-11T07:12:20.003537Z DEBUG oxc_resolver: options: ResolveOptions { ... }, path: "...", specifier: "...", ret: "..."
    at /path/to/oxc_resolver-1.8.1/src/lib.rs:212
    in oxc_resolver::resolve with path: "...", specifier: "..."
```

--------------------------------

### Example configuration for nativeMagicString

Source: https://rolldown.rs/reference/InputOptions.experimental

Example configuration enabling nativeMagicString and sourcemap output. This is an experimental feature; report any discrepancies.

```js
export default {
  experimental: {
    nativeMagicString: true
  },
  output: {
    sourcemap: true
  }
}
```

--------------------------------

### Install samply with cargo binstall

Source: https://rolldown.rs/development-guide/profiling

Installs the samply CPU profiler using cargo-binstall. Required before building Rolldown with profiling support.

```bash
cargo binstall samply
```

--------------------------------

### Setup fixtures with just setup-bench

Source: https://rolldown.rs/development-guide/benchmarking

Run this command in the project root to set up the necessary fixtures before running benchmarks.

```shell
# in project root
just setup-bench
```

--------------------------------

### intro example: polyfilling globalThis

Source: https://rolldown.rs/reference/Interface.OutputOptions

Shows how to use the intro option to prepend a polyfill for globalThis inside the bundle wrapper. The polyfill checks for globalThis, self, window, and global, and throws an error if none are found.

```javascript
export default {
  output: {
    intro: `
var globalThis = (function() {
  if (typeof globalThis !== 'undefined') return globalThis;
  if (typeof self !== 'undefined') return self;
  if (typeof window !== 'undefined') return window;
  if (typeof global !== 'undefined') return global;
  throw new Error('Unable to locate global object');
})();`,
  },
};
```

--------------------------------

### Setup Vite checkout

Source: https://rolldown.rs/development-guide/testing

Sets up the Vite checkout needed by the browser suite. The checkout is built as-is, and re-run after running an install inside the checkout because an install resets the rolldown link.

```sh
just setup-vite
```

--------------------------------

### intro

Source: https://rolldown.rs/reference/Interface.Plugin

The intro hook is equivalent to the `output.intro` option. It is async and sequential, and allows adding intro content to generated bundles.

```APIDOC
## intro

### Description
A hook equivalent to `output.intro` option. Allows adding intro content to generated bundles.

### Type
`ObjectHook<`AddonHook`, { }>`

### Kind
`async`, `sequential`

### Optional
Yes

### Notes
- Inherited from `OutputPlugin.intro`.
```

--------------------------------

### paths: Function form example

Source: https://rolldown.rs/reference/Interface.OutputOptions

Uses the function form of paths to dynamically map module IDs starting with 'lodash' to a CDN path, otherwise returns the original ID.

```javascript
{
  paths: (id) => {
    if (id.startsWith('lodash')) {
      return `https://cdn.jsdelivr.net/npm/${id}`
    }
    return id
  }
}
```

--------------------------------

### Build and preview the docs site

Source: https://rolldown.rs/development-guide/docs

Run these commands from the project root to build the static site and preview it locally. This step is only needed when modifying the docs build setup.

```sh
pnpm docs:build
pnpm docs:preview
```

--------------------------------

### Example browser playground spec

Source: https://rolldown.rs/development-guide/testing

A spec for a browser playground that imports helpers from the ~utils alias. By the time it runs, the harness has already started the server and navigated the page. It uses editFile to modify main.js and expect.poll to wait for the DOM to update.

```ts
import { describe, expect, test } from 'vitest';
import { editFile, page, waitForBuildStable } from '~utils';

describe('<name>', () => {
  test('applies an HMR update', async () => {
    editFile('main.js', (code) => code.replace('hello', 'world'));
    await expect.poll(() => page.textContent('h1')).toBe('world');
  });
});
```

--------------------------------

### Show Rolldown CLI help

Source: https://rolldown.rs/guide/getting-started

Displays CLI options and examples.

```sh
$ ./node_modules/.bin/rolldown --help
```

--------------------------------

### Start the docs dev server

Source: https://rolldown.rs/development-guide/docs

Run this command from the project root to start the VitePress dev server for the documentation. Use this instead of `pnpm docs` because that command opens the module introduction in npm.

```sh
pnpm run docs
```

--------------------------------

### configurationFieldConflict example: rolldown.config.js (JavaScript)

Source: https://rolldown.rs/reference/InputOptions.checks

Example configuration that sets jsx to 'preserve' in the transform options. This is part of the configurationFieldConflict example, showing a config value that may be overridden by a higher-priority config.

```javascript
export default {
  transform: {
    jsx: 'preserve',
  },
};
```

--------------------------------

### File structure for multi-entry example

Source: https://rolldown.rs/glossary/entry-chunk

Shows the source files for the example: component.js, render.js, app.js, and lib.js. app.js imports and executes the component and render functions; lib.js re-exports component.

```javascript
// component.js
export function component() {
  return 'Hello World';
}

// render.js
export function render(component) {
  console.log(component());
}

// app.js
import { component } from './component.js';
import { render } from './render.js';

render(component);

// lib.js
export { component } from './component.js';
```

--------------------------------

### manualChunks example

Source: https://rolldown.rs/reference/Interface.OutputOptions

Example of using manualChunks to put node_modules into a 'vendor' chunk.

```javascript
{
  manualChunks: (moduleId, meta) => {
    if (moduleId.includes('node_modules')) {
      return 'vendor';
    }
    return null;
  }
}
```

--------------------------------

### Example: Configuring plugins with defineConfig

Source: https://rolldown.rs/reference/InputOptions.plugins

Shows how to set the `plugins` option in a Rolldown config. Falsy plugins (e.g., conditional `process.env.ENV1 && examplePlugin2()`) are ignored, and nested arrays are flattened.

```javascript
import { defineConfig } from 'rolldown'

export default defineConfig({
  plugins: [
    examplePlugin1(),
    // Conditional plugins
    process.env.ENV1 && examplePlugin2(),
    // Nested plugins arrays are flattened
    [examplePlugin3(), examplePlugin4()],
  ]
})
```

--------------------------------

### Install just via Homebrew

Source: https://rolldown.rs/development-guide/setup-the-project

Install the `just` command runner using Homebrew on macOS.

```sh
brew install just
```

--------------------------------

### Bundle output for module placing order example

Source: https://rolldown.rs/in-depth/automatic-code-splitting

The bundle output shows modules placed in execution order: foo.js first, then entry.js. This is the output of the input example.

```javascript
// foo.js
var foo = 'foo';

// entry.js
console.log(foo);
```

--------------------------------

### renderStart

Source: https://rolldown.rs/reference/Interface.FunctionPluginHooks

Called initially each time bundle.generate() or bundle.write() is called. This hook is recommended for accessing output options and input options during the render phase.

```APIDOC
## renderStart

### Description
Called initially each time `bundle.generate()` or `bundle.write()` is called. To get notified when generation has completed, use the `generateBundle` and `renderError` hooks. This is the recommended hook to use when you need access to the output options passed to `bundle.generate()` or `bundle.write()` as it takes the transformations by all outputOptions hooks into account and also contains the right default values for unset options. It also receives the input options passed to `rolldown()` so that plugins that can be used as output plugins, i.e. plugins that only use generate phase hooks, can get access to them.

### Type
(`this`, `outputOptions`, `inputOptions`) => `void`

### Kind
`async`, `parallel`

### Parameters
#### this
- **Type**: `PluginContext`

#### outputOptions
- **Type**: `NormalizedOutputOptions`

#### inputOptions
- **Type**: `NormalizedInputOptions`

### Returns
`void`
```

--------------------------------

### Check Rolldown CLI version

Source: https://rolldown.rs/guide/getting-started

Run this command in the directory where Rolldown is installed to verify the installation.

```sh
$ ./node_modules/.bin/rolldown --version
```

--------------------------------

### Filter IDs starting with http

Source: https://rolldown.rs/reference/Interface.HookFilter

Include all IDs that start with `http` using a regular expression.

```js
{ id: /^http/ }
```

--------------------------------

### Example code for minifyInternalExports

Source: https://rolldown.rs/reference/Interface.OutputOptions

Example code showing the input modules used to illustrate the effect of minifyInternalExports.

```js
// main.js
import './lib.js';

// lib.js
import('./dynamic.js');
export const importantValue = 42;

// dynamic.js
import { importantValue } from './lib.js';
console.log(importantValue);
```

--------------------------------

### Install just via Cargo

Source: https://rolldown.rs/development-guide/setup-the-project

Install the `just` command runner using Cargo, Rust's package manager.

```sh
cargo install just
```

--------------------------------

### Example: entry.js with static and dynamic imports

Source: https://rolldown.rs/in-depth/automatic-code-splitting

Shows a set of modules where entry.js imports foo.js statically and dyn-entry.js dynamically. dyn-entry.js requires bar.js. This results in two statically connected groups, leading to two chunks.

```javascript
// entry.js (included in `input` option)
import foo from './foo.js';
import('./dyn-entry.js');

// dyn-entry.js
require('./bar.js');

// foo.js
export default 'foo';

// bar.js
module.exports = 'bar';
```
Tokens:
Raw