Sorry in advance, as I won't show much code, it is in a real, complex, professional project. Context: a project with Angular 19, build with Webpack 5 for pre-processing custom i18n files, using "builder": "@angular-builders/custom-webpack:browser". Our tests use Jest via "builder": "@angular-builders/jest:run". We also use ESLint which works fine after upgrade. So far, we use Node.js 20.16 and Npm 10.8. I recently upgraded our configuration files (ESLint and webpack-config and Jest config, etc.) to the ESM format, from module.export = {}; to export default {};. Of course, using "type": "module" in package.json and all that jazz. After some trials and errors, it worked fine so far. I want to upgrade to Angular 20 (we are following all upgrades after they reach the first minor version; a bit late here as we go to Angular 20.3). The stack requires either Node 20.19 or Node 22.12+ (or Node 24). OK, I wanted to upgrade anyway, straight to 22.19 to be a bit future proof. Perhaps we should aim at 24? Anyway, when I switch to Node 22 (via Nvm), if I try to launch or build the project, or just run Jest, I get errors about a "default" property which isn't in the configuration schema of Webpack or Jest. Webpack: An unhandled exception occurred: Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema. configuration has an unknown property 'default' Jest: Unknown option "default" with value {"maxWorkers": 4 ... }, the value being the set up configuration, following the export default. I guess this default is indeed related to export default, but I don't understand where this error come from, as it worked in Node 20. I understand newer versions of Node have better support for ESM, but why it worsened my setup? Do I miss some switch / configuration? I came empty from two days of Internet searches… Continue reading...
