babel-plugin-inline-json

2.1.0 verified Sat Apr 25 auth: no javascript

A Babel plugin that inlines values from JSON files (e.g., config files) at build time, replacing require() calls to matched files with the actual JSON values. Current stable version is 2.1.0, with infrequent releases. Key differentiator: simple static replacement without runtime overhead, but does not work if the require argument is an identifier or template literal. Alternative to Webpack's DefinePlugin for Babel-only workflows.

Common errors

error Error: Module 'babel-plugin-inline-json' not found ↓

cause Plugin not installed or misspelled in Babel config.

fix

Run 'npm install --save-dev babel-plugin-inline-json' and ensure the config uses 'inline-json' without 'babel-plugin-' prefix.

error TypeError: Cannot read property 'path' of undefined ↓

cause Using an identifier as the require argument instead of a string literal.

fix

Replace the require argument with a string literal, e.g., require('config') instead of const file = 'config'; require(file);

Warnings

gotcha Plugin does not work if the argument to require() is an identifier or template literal — only string literals are supported. ↓

fix Use a string literal, e.g., require('config') instead of require(fileName).

breaking Version 2.x dropped support for Babel 6. Requires Babel 7+. ↓

fix Upgrade to Babel 7 or use version 1.x for Babel 6.

deprecated The 'matchPattern' option only accepts a single string, not an array or regex object. ↓

fix Pass a single string regex pattern (e.g., 'config') for module names to match.

Install

npm install babel-plugin-inline-json

yarn add babel-plugin-inline-json

pnpm add babel-plugin-inline-json

Imports

default
wrong
```
plugins: ['babel-plugin-inline-json']
```
correct
```
plugins: [['inline-json', options]]
```
Must be configured in Babel plugins array with options object. The plugin name is 'inline-json' without 'babel-plugin-' prefix.

Quickstart

Shows how to configure the plugin in .babelrc to inline values from a JSON file matching 'config', and the resulting replacement.

// .babelrc or babel.config.js
{
  "plugins": [
    ["inline-json", { "matchPattern": "config" }]
  ]
}

// config.json
{
  "apiUrl": "https://api.example.com",
  "timeout": 5000
}

// src/index.js
import { apiUrl, timeout } from 'config'; // replaced with values
console.log(apiUrl, timeout);
// Output: https://api.example.com 5000