Go Back to projects

📦 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

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 (Experimental)

Currently Rspack works a little different, due to rspack not supporting the resolveId. It is currently worked on here

// rspack.config.js
const rspack = require("@rspack/core");

/** @type {import('@rspack/cli').Configuration} */
const config = {
  plugins: [
    new rspack.HtmlRspackPlugin({
      template: "./index.html"
    }),
    require("unplugin-yaml/rspack")(),
  ],

};
module.exports = config;

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

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.