babel-preset-wix

2.0.539 verified Mon Apr 27 auth: no javascript

Shared Babel preset used across Wix projects to standardize JavaScript compilation. Current stable version 2.0.539. Release cadence is high (multiple releases per day) due to monorepo automation. Key differentiators: opinionated defaults for Wix infrastructure, integrates with Wix build tools. Alternatives: @babel/preset-env + @babel/preset-react manually.

Common errors

error Error: [BABEL] unknown preset: "babel-preset-wix" ↓

cause babel-preset-wix is not installed or not in node_modules.

fix

Run npm install babel-preset-wix --save-dev

error Error: Cannot find module '@babel/core' ↓

cause @babel/core is a peer dependency not installed.

fix

Run npm install @babel/core --save-dev

error TypeError: Cannot read properties of undefined (reading 'call') ↓

cause Using an outdated version of @babel/core (<7.0) with babel-preset-wix v2.

fix

Upgrade @babel/core to v7 or later.

Warnings

breaking Version 2.0.0 dropped support for Node 10 and below. Make sure your Node version >= 12. ↓

fix Upgrade Node to v12 LTS or later.

deprecated The 'wix' option key was renamed to 'preset-options' in v2.0.539. Using 'wix' still works but logs a deprecation warning. ↓

fix Change options key from 'wix' to 'preset-options'.

gotcha This preset is CJS-only. If using ES module syntax (.mjs or "type": "module" in package.json), you cannot import this preset directly; use createRequire. ↓

fix Use const preset = createRequire(import.meta.url)('babel-preset-wix') in ESM.

Install

npm install babel-preset-wix

yarn add babel-preset-wix

pnpm add babel-preset-wix

Imports

default

wrong

import preset from 'babel-preset-wix'

correct

module.exports = require('babel-preset-wix')

This is a CJS preset, use require() in .babelrc or babel.config.js

default

wrong

{
  "presets": ["wix"]
}

correct

{
  "presets": ["babel-preset-wix"]
}

Full package name required in babel config

default

wrong

module.exports = {
  presets: ['babel-preset-wix', { wix: { env: 'production' } }]
}

correct

module.exports = {
  presets: ['babel-preset-wix']
}

Options must be passed as array: ['babel-preset-wix', { options }]

Quickstart

Shows how to configure babel-preset-wix with options for environment, React, and TypeScript support in a CJS config file.

// babel.config.js
module.exports = {
  presets: [
    ['babel-preset-wix', {
      env: 'production',
      react: true,
      typescript: true
    }]
  ]
};