I've encountered an issue while trying to run my web app using webpack and docker. It works fine when I run "npm start" but not when I run it with docker.
Below are the errors that I am facing:
> webpack-dev-server --open --progress --config webpack.dev.js && npm run build:css -- -w
[webpack-cli] Failed to load '/usr/src/webpack.dev.js' config
[webpack-cli] Error: Cannot find module '/usr/src/webpack.dev.js'
Require stack:
- /usr/src/node_modules/webpack-cli/lib/webpack-cli.js
- /usr/src/node_modules/webpack-cli/lib/bootstrap.js
- /usr/src/node_modules/webpack-cli/bin/cli.js
- /usr/src/node_modules/webpack-dev-server/bin/webpack-dev-server.js
at Module._resolveFilename (node:internal/modules/cjs/loader:955:15)
at Module._load (node:internal/modules/cjs/loader:803:27)
at Module.require (node:internal/modules/cjs/loader:1021:19)
at require (node:internal/modules/cjs/helpers:103:18)
at WebpackCLI.tryRequireThenImport (/usr/src/node_modules/webpack-cli/lib/webpack-cli.js:204:22)
at loadConfigByPath (/usr/src/node_modules/webpack-cli/lib/webpack-cli.js:1404:38)
at /usr/src/node_modules/webpack-cli/lib/webpack-cli.js:1454:88
at Array.map (<anonymous>)
at WebpackCLI.loadConfig (/usr/src/node_modules/webpack-cli/lib/webpack-cli.js:1454:68)
at WebpackCLI.createCompiler (/usr/src/node_modules/webpack-cli/lib/webpack-cli.js:1785:33) {
code: 'MODULE_NOT_FOUND',
requireStack: [
'/usr/src/node_modules/webpack-cli/lib/webpack-cli.js',
'/usr/src/node_modules/webpack-cli/lib/bootstrap.js',
'/usr/src/node_modules/webpack-cli/bin/cli.js',
'/usr/src/node_modules/webpack-dev-server/bin/webpack-dev-server.js'
]
}
In my webpack setup, I have split the webpack config into 3 separate files as shown below:
1. webpack.common.js
const path = require('path');
const webpack = require('webpack');
const HTMLWebpackPlugin = require('html-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const pkg = require('./package.json');
const name = pkg.name;
module.exports = {
// webpack configuration details...
};
2. webpack.dev.js
const path = require("path");
const { merge } = require("webpack-merge");
const common = require("./webpack.common.js");
module.exports = merge(common, {
// webpack development configuration details...
});
3. webpack.prod.js
const { merge } = require("webpack-merge");
const common = require("./webpack.common.js");
module.exports = merge(common, {
// webpack production configuration details...
});
In my package.json and Dockerfile, the configurations are as follows:
package.json
{
// package.json details...
}
Dockerfile
FROM node:latest
# Dockerfile setup details...
I have tried various solutions including adding COPY . . in Dockerfile, but the issue persists. Any help or guidance in resolving this would be greatly appreciated.