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 the production the files are bundled as it does.
All the dependencies are bundled in 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 like on which the project is dependent on. 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, compressing all the files and which is linked ultimately to index.html file where all the scripts are
linked at one place.
I hope now you have a brief understanding of Webpack. For a detailed info on the Webpack, please check out the documentation below:
https://webpack.js.org/concepts/
Thank you !!!
:)
