{"id":21075,"library":"craco-esbuild","title":"craco-esbuild","description":"craco-esbuild is a CRACO plugin that replaces Babel and Terser in Create React App with esbuild for significantly faster compilation, development, and test runs. Version 0.6.1 is stable but sees infrequent releases. It swaps babel-loader for esbuild-loader, TerserPlugin for ESBuildMinifyPlugin, and optionally OptimizeCssAssetsWebpackPlugin for esbuild's CSS minifier. Jest tests can use esbuild-jest instead of babel-jest. Requires @craco/craco ^7.0.0 and react-scripts ^5.0.0. Unlike alternatives like react-app-rewired or custom CRA forks, craco-esbuild integrates via CRACO's plugin system and does not require ejecting or maintaining a separate Webpack config.","status":"active","version":"0.6.1","language":"javascript","source_language":"en","source_url":"https://github.com/pradel/create-react-app-esbuild","tags":["javascript"],"install":[{"cmd":"npm install craco-esbuild","lang":"bash","label":"npm"},{"cmd":"yarn add craco-esbuild","lang":"bash","label":"yarn"},{"cmd":"pnpm add craco-esbuild","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Core peer dependency: craco-esbuild is a plugin for CRACO, which is required to override CRA webpack config.","package":"@craco/craco","optional":false},{"reason":"Peer dependency: craco-esbuild targets CRA projects using react-scripts v5.","package":"react-scripts","optional":false}],"imports":[{"note":"craco-esbuild is a CommonJS package; ESM import may cause errors. Use require() in craco.config.js which is typically not transpiled.","wrong":"import CracoEsbuildPlugin from 'craco-esbuild';","symbol":"CracoEsbuildPlugin","correct":"const CracoEsbuildPlugin = require('craco-esbuild');"}],"quickstart":{"code":"// 1. Install: npm install --save-dev @craco/craco craco-esbuild\n// 2. Create craco.config.js:\nconst CracoEsbuildPlugin = require('craco-esbuild');\n\nmodule.exports = {\n  plugins: [{ plugin: CracoEsbuildPlugin }],\n};\n\n// 3. Update package.json scripts:\n{\n  \"scripts\": {\n    \"start\": \"craco start\",\n    \"build\": \"craco build\",\n    \"test\": \"craco test\"\n  }\n}\n\n// 4. Run: npm start\n","lang":"javascript","description":"Install craco-esbuild with @craco/craco, configure the plugin in craco.config.js, and update scripts to use craco instead of react-scripts."},"warnings":[{"fix":"Ensure react-scripts is version 5.x. Check compatibility with @craco/craco version (requires ^7.0.0).","message":"craco-esbuild may not work with react-scripts versions other than 5.x. Using older react-scripts (e.g., 4.x) will cause webpack configuration conflicts.","severity":"breaking","affected_versions":">=0.0.0"},{"fix":"In craco.config.js, set esbuildLoaderOptions: { loader: 'tsx' }.","message":"If your project uses TypeScript, you must configure esbuildLoaderOptions with loader: 'tsx' in craco.config.js. Missing this results in build failures because esbuild defaults to JSX loader.","severity":"breaking","affected_versions":">=0.0.0"},{"fix":"If you rely on Babel plugins (e.g., import/export, class properties), consider using esbuild's built-in transforms or replace the plugin with a custom solution that combines esbuild and Babel.","message":"CracoEsbuildPlugin replaces babel-loader for all files, including those that might need Babel plugins (e.g., for polyfills or custom transforms). esbuild does not support Babel plugins.","severity":"gotcha","affected_versions":">=0.0.0"},{"fix":"Set skipEsbuildJest: true in plugin options to revert to babel-jest for tests, or configure esbuildJestOptions with appropriate loaders.","message":"When skipEsbuildJest is false (default), esbuild-jest replaces babel-jest for test files. This may cause issues with test files that use JSX or TypeScript without proper loader configuration.","severity":"gotcha","affected_versions":">=0.0.0"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Install esbuild: npm install --save-dev esbuild","cause":"esbuild is not installed as a dependency. craco-esbuild does not automatically install esbuild.","error":"Module not found: Error: Can't resolve 'esbuild' in '...'"},{"fix":"Check craco.config.js: ensure plugin object has { plugin: CracoEsbuildPlugin } and options are properly structured (e.g., esbuildLoaderOptions, not esbuildLoader).","cause":"CRACO plugin configuration is incorrect, often due to missing or misspelled options.","error":"ValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema."},{"fix":"Use require('craco-esbuild') instead of import. In craco.config.js, const CracoEsbuildPlugin = require('craco-esbuild');","cause":"Using an incorrect import style (e.g., default import via ES module) when the package is CommonJS.","error":"TypeError: CracoEsbuildPlugin is not a constructor"},{"fix":"Install a compatible esbuild version: npm install esbuild@0.7.22 or check craco-esbuild peerDependencies.","cause":"Version mismatch between craco-esbuild and esbuild. esbuild >=0.8.0 changed module resolution.","error":"UnhandledPromiseRejectionWarning: Error: No known conditions for './package.json' specifier in 'esbuild' package"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}