Non-Vite Setups

If you’re not using Vite, use the Babel plugin for the same build-time transform.

Install

npm install -D babel-plugin-inlinecms

Configure

// .babelrc or babel.config.json
{
  "plugins": ["babel-plugin-inlinecms"]
}

Or with options:

{
  "plugins": [["babel-plugin-inlinecms", { "skipFiles": ["test/**"] }]]
}

What it does

The Babel plugin applies the identical transform as the Vite plugin:

• Finds JSX elements with the inline-cms prop
• Generates a stable SHA1 fingerprint from file:line:col
• Replaces the tag with its InlineCMS wrapper (h1 to InlineH1, etc.)
• Auto-injects the @inlinecms/react import

Supported toolchains

• Create React App
• Next.js (with custom Babel config)
• Webpack + babel-loader
• Parcel
• Rollup + @rollup/plugin-babel

The transform is framework-agnostic at the Babel level. It only requires JSX syntax support.