How to export the configuration of `webpack.config.js` using pure ESM? - node.js

Question

I'm trying to convert into pure ESM the webpack.config.js
import path from 'path'
import {fileURLToPath} from 'url'
import HtmlWebpackPlugin from 'html-webpack-plugin'
import CopyPlugin from 'copy-webpack-plugin'
import MiniCssExtractPlugin from 'mini-css-extract-plugin'
import webpack from 'webpack'
var main_config = {
}
var renderer_config = {
}
var config = [
main_config,
renderer_config,
]
export config
I get this error:
yarn start
yarn run v1.22.18
$ yarn run build && ELECTRON_DISABLE_SECURITY_WARNINGS=true electron ./dist/main/main.js
$ npx webpack --config ./webpack.config.js
[webpack-cli] Failed to load '/home/raphy/NEW-Raphy-Template
/webpack.config.js' config
[webpack-cli] SyntaxError: Unexpected token 'export'
at ESMLoader.moduleStrategy (node:internal/modules
/esm/translators:117:18)
at ESMLoader.moduleProvider (node:internal/modules/esm/loader:337:14)
at async link (node:internal/modules/esm/module_job:70:21)
I tried also with
export renderer_config, main_config
and with
export renderer_config
export main_config
but still get error
Other info:
node: v16.15.0
O.S. : Ubuntu 20.04 Desktop
npm: v 8.5.5

Answer 1

You will need to export config as default with
export default config
You will also need to update your package.json to set
"type": "module"
or change the extension of the config to .mjs so that node understands this is as es module ( See: https://nodejs.org/api/packages.html#type )