What Is Webpack Briefly

Know about Webpack!!!

It is the management system that is used in development to maintain the files in systematic order. Like if we have several files and corresponding HTML and CSS files for that, it will be a difficult task. To maintain all those files, Webpack is useful. It bundles all the files and necessary configuration in it which is used for development. Configurations of development are handled by Webpack, for example

If you want the changes to reflect immediately in the web here watch is used to do that. To increase the target API timeout proxy is being used.

So make sure whatever the changes you want to do it will be done in only development, the production configuration is handled by the server on which your application is running. In production, the files are bundled as it does. All the dependencies are bundled in the vendor.[somehash].js file. All the app-related modules will be bundled in-app.[somehash].js files To map these all files manifest is used, which maps all the modules to the respective pages.

The Main core concepts of Webpack are:

Entry — where the project to be started normally that is index or app.js files

Output — tells Webpack where to emit the bundles it creates and how to name these files.

Loaders —These are the loaders on which the project is dependent. let’s say for example

Style loader which is used for styles CSS loaders to load CSS properties

Plugins — These are kind of modules which helps the project to work smoothly.

So, Webpack, at last, compresses all the files which are linked ultimately to the index.html files where all the scripts are linked in one place.

I hope now you have a brief understanding of Webpack. For detailed info on the Webpack, please check out the documentation below: https://webpack.js.org/concepts/

Thank you !!! :)