bun-plugin-yaml

The official YAML plugin for Bun. Adds support for .yml/.yaml imports.

Installation

1bun add bun-plugin-yaml -d

Bundler usage

This plugin can be used to support .yaml loaders in Bun's bundler by passing it into the plugins array:

1import yamlPlugin from "bun-plugin-yaml";
2
3Bun.build({
4  entrypoints: ["./index.tsx"],
5  // other config
6
7  plugins: [yamlPlugin()],
8});

You can now import .yaml files from your source code:

1import data from "./data.yaml";
2
3export function Component() {
4  return <div>{data.name}</div>;
5}

The contents of the .yaml file will be inlined into your bundle.

Runtime usage

To use as a runtime plugin, create a file that registers the plugin:

1// yaml.ts
2import yamlPlugin from "bun-plugin-yaml";
3
4Bun.plugin(yamlPlugin());

Then preload it in your bunfig.toml:

1preload = ["./yaml.ts"]

TypeScript

By default VSCode/TypeScript will not recognize .yaml imports. To avoid import errors, add the following to your tsconfig.json:

1  {
2    "compilerOptions": {
3      "types": [
4        // other packages, e.g. "bun-types",
5+       "bun-plugin-yaml"
6      ]
7    }
8  }

Contributing

1$ bun install # project setup
2$ bun test # run tests