How To set up Webpack For beginners

Start writing here...Setting Up Webpack For Beginners
Setting up webpack for the first time can be tricky, in terms of where and how to arrange your files in the order that allows webpack to bundle them successfully into one main file.
now the first step is to install webpack, you can do so using the command line, and running the following command
"npm install webpack", or if you make use of yarn instead "yarn add webpack"
now after installing webpack, you need to head on to your package.json folder and if it was successfully installed you would see webpack pointing to the version installed, for example; webpack: "^4.39.3".
now the next step is to set up a build in the package.json file and set to watch. example;

"scripts": {
"build": "webpack --watch"
}

then the next step is to set up a config file, this is the file webpack would look into to know the files its compiling where they are and the file it bundles everything t, you go to the root of your app and you setup "webpack.config.js"
then after creating the file you'd have to set it up by running the following:
let us say the scrip you want it to read the data that should be bundled placed in an src folder and is called
'exampleScript.js'
and the script that you want every code bundled to is in a folder called bundle and it's named
'exampleBundleScript.js'
we run the following command

const path = require('path');
module.exprots = {
    entry: ['./src/exampleScript.js'],
    output: {
        Path: path.resolve(__dirname, 'bundle'),
        filename: 'exampleBundleScript.js'
    }
};

Note: The index HTML file has to be put in the same folder with the example bunndlescript.js folder that is in the bundle folder.
Now with all these steps in place you have now set up webpack successfully.