{"id":19269,"library":"babel-preset-cssxjs","title":"CSSX Babel Preset","description":"A Babel preset for compiling CSSX, a CSS-in-JS syntax extension that allows writing CSS directly in JavaScript/JSX files. Version 0.2.32 is a pre-1.0 release with no regular release cadence. It strips CSSX syntax during transpilation, outputting plain JavaScript. Differentiates from other CSS-in-JS libraries by using a custom parser/tokenizer rather than template literals. Limited adoption and documentation.","status":"active","version":"0.2.32","language":"javascript","source_language":"en","source_url":null,"tags":["javascript"],"install":[{"cmd":"npm install babel-preset-cssxjs","lang":"bash","label":"npm"},{"cmd":"yarn add babel-preset-cssxjs","lang":"bash","label":"yarn"},{"cmd":"pnpm add babel-preset-cssxjs","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Requires Babel to run","package":"@babel/core","optional":false},{"reason":"Core library for parsing CSSX syntax","package":"cssxjs","optional":false}],"imports":[{"note":"This package is a CJS preset and should be used in Babel config, not imported directly.","wrong":"import preset from 'babel-preset-cssxjs'","symbol":"default (preset)","correct":"module.exports = { presets: ['babel-preset-cssxjs'] }"},{"note":"The preset is exported as a function, no default property.","wrong":"const babelPresetCssxjs = require('babel-preset-cssxjs').default","symbol":"require","correct":"const babelPresetCssxjs = require('babel-preset-cssxjs')"},{"note":"Named import is incorrect; use default import.","wrong":"import { babelPresetCssxjs } from 'babel-preset-cssxjs'","symbol":"ESM import (rarely used)","correct":"import babelPresetCssxjs from 'babel-preset-cssxjs'"}],"quickstart":{"code":"// .babelrc\n{\n  \"presets\": [\n    [\"babel-preset-cssxjs\", {}]\n  ]\n}\n\n// Then run: npx babel --presets=babel-preset-cssxjs input.js -o output.js","lang":"javascript","description":"Shows how to configure the preset in .babelrc and run Babel with the preset."},"warnings":[{"fix":"Pin to exact version and test after every update.","message":"Breaking changes in unpublished versions: no changelog; treat minor bumps as breaking.","severity":"breaking","affected_versions":">=0.0.0"},{"fix":"Install cssxjs: npm install cssxjs","message":"Preset requires runtime dependency 'cssxjs' for parsing; ensure it is installed.","severity":"gotcha","affected_versions":">=0.0.0"},{"fix":"Upgrade to Babel 7 and latest preset version.","message":"Babel 6 support dropped; use Babel 7+.","severity":"deprecated","affected_versions":"<0.1.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Run: npm install cssxjs","cause":"Missing runtime dependency cssxjs.","error":"Error: Cannot find module 'cssxjs'"},{"fix":"Use require('babel-preset-cssxjs') directly, not default property.","cause":"Incorrect import or misconfigured preset.","error":"Error: Preset requires a function or object, got 'undefined'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}