Support ES6 in config

[dilanx]

Unlike Webpack 5, CRACO does not support ES6 modules. Make it so it does.

Error [ERR_REQUIRE_ESM]: require() of ES Module .../craco.config.js from .../node_modules/cosmiconfig/dist/loaders.js not supported.
craco.config.js is treated as an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which declares all .js files in that package scope as ES modules.
Instead rename craco.config.js to end in .cjs, change the requiring code to use dynamic import() which is available in all CommonJS modules, or change "type": "module" to "type": "commonjs" in .../package.json to treat all .js files as CommonJS (using .mjs for all ES modules instead).

[thediveo]

Any news?

[philipvella]

So you're suggesting playing around with coaco package.json which is installed in the node_modules?

How I wish COACO supports coaco.config.mjs out of the box? 😑

[electriquo]

if you name craco configuration as craco.config.cjs, does it ease your pain?

[juleshwar]

I followed this and fixed my issue

1. Rename craco.config.js to craco.config.cjs
2. Add this webpack config to craco.config.cjs

module.exports = {
    webpack: {
        configure: {
            module: {
                rules: [
                    {
                        test: /\.m?js$/,
                        resolve: {
                            fullySpecified: false,
                        },
                    },
                ],
            },
        },
    },
};

Got the answer from SO -> https://stackoverflow.com/a/75109686

[dheeraj-jn]

@dilanx I see both cosmiconfig and cosmiconfig-typescript-loader have added support for ESM in their most recent releases. Would it help upgrading these dependencies?