unplugin-yaml

Allow import YAML file for Vite, Webpack, Rollup and esbuild. With TypeScript support. Powered by unplugin.

Install

npm i -D unplugin-yaml

Usage

Tip

You can view all examples here.

Vite

// vite.config.ts
import YAMLPlugin from "unplugin-yaml/vite";

export default defineConfig({
  plugins: [
    YAMLPlugin({ /* options */ }),
  ],
});

Rollup

// rollup.config.js
import YAMLPlugin from "unplugin-yaml/rollup";

export default {
  plugins: [
    YAMLPlugin({ /* options */ }),
  ],
};

Webpack

// webpack.config.js
module.exports = {
  /* ... */
  plugins: [
    require("unplugin-yaml/webpack").default({ /* options */ }),
  ],
};

Nuxt

// nuxt.config.js
export default defineNuxtConfig({
  modules: [
    ["unplugin-yaml/nuxt", { /* options */ }]
  ],
});

Astro

// astro.config.mjs
import { defineConfig } from "astro/config";
import YAMLPlugin from "unplugin-yaml/astro";

// https://astro.build/config
export default defineConfig({
  integrations: [
    YAMLPlugin({
      /* options */
    })
  ]
});

esbuild

// esbuild.config.js
import { build } from "esbuild";
import YAMLPlugin from "unplugin-yaml/esbuild";

build({
  /* ... */
  plugins: [
    YAMLPlugin({
      /* options */
    }),
  ],
});

Farm

// farm.config.ts
import { defineConfig } from "@farmfe/core";
import vue from "@vitejs/plugin-vue";
import YAMLPlugin from "unplugin-yaml/farm";

export default defineConfig({
  vitePlugins: [
    vue(),
  ],
  plugins: [
    YAMLPlugin({
      /* options */
    })
  ]
});

Rspack

// rspack.config.mjs
import rspack from "@rspack/core";
import YAMLPlugin from "unplugin-yaml/rspack";

/** @type {import('@rspack/core').Configuration} */
export default {
  plugins: [
    new rspack.HtmlRspackPlugin({
      template: "./index.html"
    }),
    YAMLPlugin()
  ],
};

Rolldown (Experimental)

// rolldown.config.js
import { defineConfig } from "rolldown";
import YAMLPlugin from "unplugin-yaml/rolldown";

export default defineConfig({
  input: "./index.js",
  plugins: [
    YAMLPlugin({
      /* options */
    }),
  ],
});

Configuration

YAMLPlugin({
  include: [
    /\.yamlcustom$/, // .yamlcustom
  ],
  parserOptions: {
    // see js-yaml load options
  }

});

TypeScript

Important

If you are using JSR, you need to copy the yaml.d.ts file into your project. jsr doesn't support augmentation on global types.

If you are using TypeScript, you need to add the following to your tsconfig.json file:

{
  "compilerOptions": {
    "types": [
      "unplugin-yaml/types"
    ]
  }
}

📄 License

Published under MIT License.