{"id":20878,"library":"yaml-loader","title":"yaml-loader","description":"A Webpack loader that converts YAML files into JavaScript objects or JSON strings, using the `yaml` library for parsing. The current stable version is 0.9.0, released with support for Webpack 5+ and Node.js 20+. It offers options like `asJSON` for JSON output, `asStream` for parsing multi-document YAML streams, and `namespace` for extracting specific sub-trees. Unlike alternatives like js-yaml-loader, this loader leverages the more modern `yaml` package and is actively maintained. Release cadence is irregular, with major version bumps for breaking changes.","status":"active","version":"0.9.0","language":"javascript","source_language":"en","source_url":"https://github.com/eemeli/yaml-loader","tags":["javascript","yaml","webpack","loader","json"],"install":[{"cmd":"npm install yaml-loader","lang":"bash","label":"npm"},{"cmd":"yarn add yaml-loader","lang":"bash","label":"yarn"},{"cmd":"pnpm add yaml-loader","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency; loader is designed to work with Webpack 5+","package":"webpack","optional":false},{"reason":"used internally for parsing YAML files","package":"yaml","optional":false}],"imports":[{"note":"When using options, the configuration must use `use` or `loader` with `options` object.","wrong":"module.exports = { module: { rules: [ { test: /\\.ya?ml$/, loader: 'yaml-loader' } ] } }","symbol":"default loader","correct":"module.exports = { module: { rules: [ { test: /\\.ya?ml$/, use: 'yaml-loader' } ] } }"},{"note":"ESM import works with Webpack's module bundling; require() may not work in all setups.","wrong":"const config = require('./config.yaml');","symbol":"JavaScript import from YAML","correct":"import config from './config.yaml';"},{"note":"The loader itself does not re-export yaml types; use the 'yaml' package directly if type access is needed.","wrong":"import yaml from 'yaml'; // yaml is not directly imported by the loader user","symbol":"TypeScript import (type)","correct":"import type { YAMLType } from 'yaml'; // not needed for loader"},{"note":"Query parameters override options set in webpack.config.js.","symbol":"Options with query parameter","correct":"import data from './data.yaml?namespace=config';"},{"note":"Inline loader syntax is discouraged; use Webpack configuration instead.","wrong":"const data = require('yaml-loader!./data.yaml');","symbol":"CommonJS require","correct":"const data = require('./data.yaml');"}],"quickstart":{"code":"// webpack.config.js\nmodule.exports = {\n  module: {\n    rules: [\n      {\n        test: /\\.ya?ml$/,\n        use: 'yaml-loader',\n      },\n    ],\n  },\n};\n\n// app.js\nimport config from './config.yaml';\nconsole.log(config);\n\n// config.yaml\nserver:\n  port: 8080\n  host: localhost\n","lang":"javascript","description":"Configures Webpack to import YAML files as JavaScript objects using yaml-loader."},"warnings":[{"fix":"Upgrade to Webpack 5 and Node.js 20 or later.","message":"Drop support for Webpack v4 (#61) and unsupported Node.js versions","severity":"breaking","affected_versions":">=0.9.0"},{"fix":"Set `{ asJSON: true }` option if you need JSON output.","message":"Output JavaScript source by default, rather than JSON (#27)","severity":"breaking","affected_versions":">=0.7.0"},{"fix":"Some YAML files parsed as valid by js-yaml may now be invalid; review your YAML files and update if needed.","message":"Replace `js-yaml` dependency with `yaml`","severity":"breaking","affected_versions":">=0.6.0"},{"fix":"Output is no longer multiline or tab-indented; if you need prettified JSON, chain another loader or use `asJSON` option and format yourself.","message":"Drop output JSON prettification","severity":"breaking","affected_versions":">=0.6.0"},{"fix":"Upgrade Node.js to at least 12.13.","message":"Node.js versions below 12.13 are no longer supported","severity":"deprecated","affected_versions":">=0.8.0"},{"fix":"Use either `options` in config or query parameters, not both, to avoid confusion.","message":"Options set in webpack.config.js via `options` object are superseded by query parameters (`?namespace=...`)","severity":"gotcha","affected_versions":"all"},{"fix":"Do not combine `asStream` with `namespace`; they are mutually exclusive.","message":"The `asStream` option always outputs an array and ignores `namespace`","severity":"gotcha","affected_versions":">=0.6.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Add module rule in webpack.config.js: { test: /\\.ya?ml$/, use: 'yaml-loader' }","cause":"Webpack is trying to parse a YAML file without the yaml-loader configured.","error":"Module parse failed: Unexpected token (1:2)"},{"fix":"Run: npm install --save-dev yaml","cause":"The 'yaml' package is not installed.","error":"Error: Cannot find module 'yaml'"},{"fix":"Configure the loader in webpack.config.js and use static imports instead.","cause":"Using inline loader syntax like `require('yaml-loader!./file.yaml')` with dynamic path.","error":"Critical dependency: the request of a dependency is an expression"},{"fix":"Use: { use: { loader: 'yaml-loader', options: { asJSON: true } } }","cause":"Passing options with `loader` key directly instead of inside `use`.","error":"yaml-loader: options are not allowed for this loader (use 'use' instead of 'loader' with options)"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}