webpack multiple input files and multiple output files

Question

I'm creating a non-SPA website and wanted to use webpack, but I can't achieve situation when I have multiple input files and multiple output files. My input files has structure:

-/front -app.js -/js -main.js -login.js

and I want output to be:

-/web -/bundles -main.js -login.js

here's beginning of my webpack.config.js:

module.exports = {
    context: path.resolve('src/front'), // main webpack folder
    entry: ["./app.js"],
    output: {
        filename: "./web/bundles/[name].js"
    },

Is it even achievable?

Now, only all required files in app.js are bundles under the name main.js in /web/bundles folder. How to change it?

Answer 1

Use multiple entry points like this:

entry: {
  app: './app',
  main: './js/main.js',
  login: './js/login.js',
},
output: {
  path: path.join(__dirname, './public'),
  filename: '[name].js'
},