{"id":19399,"library":"canopy-webpack-config","title":"Canopy Webpack Config","description":"Opinionated webpack 5 defaults for Canopy micro-frontend services. Current stable version 4.4.3, maintained primarily for internal Canopy use. Provides automatic AMD output, externals for common dependencies (react, react-dom, luxon, react-hook-form, @canopytax/*), babel-loader integration, and bundle analysis via webpack-bundle-analyzer. Differentiator: handles sofe service externals out of the box, supports TypeScript via object option, and remains fully overrideable without ejecting. Release cadence is irregular, driven by internal needs. Requires webpack 5, babel-loader, @babel/runtime, @babel/plugin-transform-runtime.","status":"active","version":"4.4.3","language":"javascript","source_language":"en","source_url":"ssh://git@github.com/CanopyTax/canopy-webpack-config","tags":["javascript"],"install":[{"cmd":"npm install canopy-webpack-config","lang":"bash","label":"npm"},{"cmd":"yarn add canopy-webpack-config","lang":"bash","label":"yarn"},{"cmd":"pnpm add canopy-webpack-config","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Required as peer dependency for babel transforms at runtime.","package":"@babel/runtime","optional":false},{"reason":"Required as peer dependency for babel transforms at build time.","package":"@babel/plugin-transform-runtime","optional":false}],"imports":[{"note":"Package uses CommonJS and does not support ESM imports. Use require() in Node.js environments.","wrong":"import canopyWebpackConfig from 'canopy-webpack-config';","symbol":"default","correct":"const canopyWebpackConfig = require('canopy-webpack-config');"},{"note":"The default export is a function that takes two arguments (name, config). Calling it without arguments or forgetting the name parameter is a common mistake.","wrong":"module.exports = canopyWebpackConfig;","symbol":"default","correct":"const canopyWebpackConfig = require('canopy-webpack-config');\nmodule.exports = canopyWebpackConfig('my-app', { /* overrides */ });"},{"note":"Since v4.2.0, TypeScript support requires an options object (e.g., { typescript: {} }) instead of a boolean. Passing true will break.","wrong":"module.exports = canopyWebpackConfig('my-app', { typescript: true });","symbol":"TypeScript usage","correct":"const canopyWebpackConfig = require('canopy-webpack-config');\nmodule.exports = canopyWebpackConfig('my-app', { typescript: {} });"}],"quickstart":{"code":"const canopyWebpackConfig = require('canopy-webpack-config');\nconst path = require('path');\n\nmodule.exports = canopyWebpackConfig('my-app', {\n  entry: './src/index.js',\n  output: {\n    path: path.resolve(__dirname, 'dist'),\n  },\n  module: {\n    rules: [\n      {\n        test: /\\.css$/,\n        use: ['style-loader', 'css-loader'],\n      },\n    ],\n  },\n  plugins: [\n    // any custom plugins\n  ],\n});","lang":"javascript","description":"Creates a webpack configuration for a Canopy service with custom CSS rule and output path, overriding defaults."},"warnings":[{"fix":"If using webpack-dev-server, update scripts to use 'webpack serve' instead of 'webpack-dev-server'. Remove any references to unused-files-webpack-plugin.","message":"In v4.0.0, webpack 5 upgrade removed unused-files-webpack-plugin and changed webpack-dev-server command to 'webpack serve'.","severity":"breaking","affected_versions":">=4.0.0 <5.0.0"},{"fix":"Change { typescript: true } to { typescript: {} } or pass a configuration object.","message":"In v4.2.0, TypeScript option changed from boolean to an options object. Passing { typescript: true } breaks.","severity":"breaking","affected_versions":">=4.2.0"},{"fix":"Add babel-loader, css-loader, etc. as devDependencies in your project and configure them in the override config.","message":"Package does not install babel-loader or other loaders; you must install them separately.","severity":"gotcha","affected_versions":">=3.0.0"},{"fix":"Export the result of calling canopyWebpackConfig(name, overrides), not the function itself.","message":"Default export is a function that MUST be called with two arguments; simply exporting it as a config object will fail.","severity":"gotcha","affected_versions":">=3.0.0"},{"fix":"Upgrade to v4.1.1 or later.","message":"v4.1.1 fixed an overly aggressive externals rule that stripped all react-dom submodules. Users on 4.1.0 may have broken builds when using libraries like @floating-ui/react-dom.","severity":"deprecated","affected_versions":">=4.1.0 <4.1.1"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Create a file at src/externals.ts (or .js) that exports an array of external module names, or disable the externals feature by not including it in your config.","cause":"The externals feature expects a src/externals.ts or src/externals.js file to exist. If missing, webpack fails.","error":"Error: Cannot find module './externals'"},{"fix":"Use const canopyWebpackConfig = require('canopy-webpack-config'); and then call it as a function.","cause":"Importing the package with ESM import instead of CommonJS require() or incorrectly calling the export.","error":"TypeError: canopyWebpackConfig is not a function"},{"fix":"Run yarn add --dev babel-loader or npm install --save-dev babel-loader.","cause":"babel-loader is not included as a dependency and must be installed separately.","error":"Module not found: Error: Can't resolve 'babel-loader'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}