{"id":20539,"library":"scratch-webpack-configuration","title":"scratch-webpack-configuration","description":"Shared webpack configuration builder for Scratch projects, version 3.1.2 as of March 2026. Provides a fluent API to construct webpack 5 configurations with defaults for Scratch's build pipeline, including Babel (with optional React), CSS (postcss-loader, css-loader, style-loader), TypeScript (ts-loader), asset modules via resource queries, chunk splitting, and target-specific externals for browserslist and Node. Released under BSD-3-Clause (was AGPL-3.0 in v2). Differentiators: opinionated but extensible via clone/merge, handles Scratch-specific module rules and externals, and integrates with Scratch's semantic release config. Requires webpack 5 and peer dependencies like @babel/preset-env, babel-loader, css-loader, postcss-loader, etc.","status":"active","version":"3.1.2","language":"javascript","source_language":"en","source_url":"https://github.com/scratchfoundation/scratch-webpack-configuration","tags":["javascript","Scratch","webpack"],"install":[{"cmd":"npm install scratch-webpack-configuration","lang":"bash","label":"npm"},{"cmd":"yarn add scratch-webpack-configuration","lang":"bash","label":"yarn"},{"cmd":"pnpm add scratch-webpack-configuration","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency; the configuration generates webpack 5 config objects.","package":"webpack","optional":false},{"reason":"Peer dependency; used by babel-loader rule.","package":"@babel/preset-env","optional":false},{"reason":"Peer dependency; processes JS/JSX files.","package":"babel-loader","optional":false},{"reason":"Peer dependency; handles CSS imports.","package":"css-loader","optional":false},{"reason":"Peer dependency; processes PostCSS plugins.","package":"postcss-loader","optional":false},{"reason":"Peer dependency; injects CSS into DOM.","package":"style-loader","optional":false},{"reason":"Peer dependency; TypeScript compilation (enableTs flag).","package":"ts-loader","optional":true}],"imports":[{"note":"ESM-only since v3; CommonJS require will fail.","wrong":"const ScratchWebpackConfigBuilder = require('scratch-webpack-configuration');","symbol":"ScratchWebpackConfigBuilder","correct":"import ScratchWebpackConfigBuilder from 'scratch-webpack-configuration';"},{"note":"Default export, not named. TypeScript: use default import.","symbol":"ScratchWebpackConfigBuilder","correct":"import ScratchWebpackConfigBuilder from 'scratch-webpack-configuration';"},{"note":"Common mistake: using named import instead of default.","wrong":"import { ScratchWebpackConfigBuilder } from 'scratch-webpack-configuration';","symbol":"ScratchWebpackConfigBuilder","correct":"import ScratchWebpackConfigBuilder from 'scratch-webpack-configuration';"}],"quickstart":{"code":"import ScratchWebpackConfigBuilder from 'scratch-webpack-configuration';\n\nconst builder = new ScratchWebpackConfigBuilder({\n    rootPath: __dirname,\n    enableReact: true\n})\n.setTarget('browserslist')\n.addModuleRule({\n    test: /\\.css$/,\n    use: ['style-loader', 'css-loader', 'postcss-loader']\n})\n.addPlugin(new (require('copy-webpack-plugin'))({\n    patterns: [{ from: 'public' }]\n}));\n\nexport default builder.get();","lang":"javascript","description":"Shows creating a ScratchWebpackConfigBuilder, enabling React, setting target to browserslist, adding a CSS loader rule, and a CopyWebpackPlugin."},"warnings":[{"fix":"Update to v3.0.0+ to use BSD-3-Clause license.","message":"v2.0.0 changed license from MIT to AGPL-3.0-only, then v3.0.0 reverted to BSD-3-Clause.","severity":"deprecated","affected_versions":">=2.0.0 <3.0.0"},{"fix":"Use import syntax or dynamic import(). If you must use CommonJS, stay on v1.x (v2.x is also AGPL).","message":"v3.0.0 is ESM-only; CommonJS require() will throw.","severity":"breaking","affected_versions":">=3.0.0"},{"fix":"Install all peer deps listed in the package.json. Missing css-loader/url-loader will cause build failures.","message":"peer dependencies must be installed manually; the package does not auto-install them.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Ensure Node.js >=14 and webpack ^5.90.3.","message":"v3.0.0 removed support for Node < 14; targets now require webpack 5.","severity":"breaking","affected_versions":">=3.0.0"},{"fix":"Add @babel/preset-react to devDependencies.","message":"When using enableReact: true, you must install @babel/preset-react separately.","severity":"gotcha","affected_versions":">=1.0.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 scratch-webpack-configuration --save-dev","cause":"Package not installed in node_modules.","error":"Error: Cannot find module 'scratch-webpack-configuration'"},{"fix":"Change import { ScratchWebpackConfigBuilder } to import ScratchWebpackConfigBuilder","cause":"Using named import instead of default import after switching to ESM.","error":"TypeError: ScratchWebpackConfigBuilder is not a constructor"},{"fix":"npm install css-loader --save-dev","cause":"Missing peer dependency.","error":"Module not found: Error: Can't resolve 'css-loader'"},{"fix":"Update to v3 and review legal implications.","cause":"Upgrading from v2 to v3 changes license.","error":"BREAKING CHANGE: The license for this project has changed back to BSD-3-Clause"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}