webpack 5 Error "Can't resolve 'uglify-js', '@swc/core', 'esbuild'

Question

I have some errors with webpack 5, express, github actions. I use the github actions because want to use github secrets. also, I use webpack because of using the secrets in the code.

anyway, I got errors below,

ERROR in ./node_modules/terser-webpack-plugin/dist/utils.js 479:6-26
Module not found: Error: Can't resolve 'uglify-js' in '/Users/luna/workspace/express_api/node_modules/terser-webpack-plugin/dist'
@ ./node_modules/terser-webpack-plugin/dist/index.js 27:4-22
@ ./webpack.config.js 2:21-53
@ ./app.js 13:15-45

ERROR in ./node_modules/terser-webpack-plugin/dist/utils.js 557:14-34
Module not found: Error: Can't resolve '@swc/core' in '/Users/luna/workspace/express_api/node_modules/terser-webpack-plugin/dist'
@ ./node_modules/terser-webpack-plugin/dist/index.js 27:4-22
@ ./webpack.config.js 2:21-53
@ ./app.js 13:15-45

ERROR in ./node_modules/terser-webpack-plugin/dist/utils.js 635:18-36
Module not found: Error: Can't resolve 'esbuild' in '/Users/luna/workspace/express_api/node_modules/terser-webpack-plugin/dist'
@ ./node_modules/terser-webpack-plugin/dist/index.js 27:4-22
@ ./webpack.config.js 2:21-53
@ ./app.js 13:15-45

Also, got 15 warnings. if you want to the warnings, let me know.

what is the problem?

Below is the webpack.config.js

const webpack = require("webpack");

module.exports = {
  target: "async-node",
  mode: "production",
  entry: "./app.js",
  output: {
    path: "/dist",
    filename: "main.js",
  },
  plugins: [
    new webpack.DefinePlugin({
      "process.env.PA_URL": JSON.stringify(process.env.PA_URL),
      "process.env.PA5_EMAIL": JSON.stringify(process.env.PA5_EMAIL),
      "process.env.PA5_PASSWORD": JSON.stringify(process.env.PA5_PASSWORD),
    }),
  ],
};

the webpack version is wrong?

Answer 1

You are bundling your entry file, but also any node_modules your ./app.js requires, which in turn tries to require a bunch of third-party stuff, which is not available - hence the errors on missing modules.

Exclude those node_modules by extending your webpack config: yarn add -D webpack-node-externals (see: https://www.npmjs.com/package/webpack-node-externals)

const webpack = require("webpack");
const nodeExternals = require("webpack-node-externals");

module.exports = {
  target: "async-node",
  mode: "production",
  entry: "./app.js",
  externalsPresets: { node: true },   // <-- here
  externals: [nodeExternals()],       // <-- and here
  ...etc

That should exclude them and you should be good to go.