{"id":749,"date":"2017-05-11T13:05:59","date_gmt":"2017-05-11T13:05:59","guid":{"rendered":"http:\/\/blog.onclickinnovations.com\/?p=749"},"modified":"2017-05-11T13:05:59","modified_gmt":"2017-05-11T13:05:59","slug":"webpack","status":"publish","type":"post","link":"https:\/\/onclickinnovations.com\/blog\/webpack\/","title":{"rendered":"Webpack"},"content":{"rendered":"

“Webpack” \u00a0a powerful module bundler, which\u00a0is common JavaScript file that combine html data, css data, javascript data etc in common file together and should be served to the client in a response to a single file request. It takes in a bunch of assets (ie. source, images, markup, CSS, …) and turns that into something you can provide to the client. WEBPACK<\/a> \u00a0supports advanced functionality such as hot module reloading (instant updates of React components without refresh), lazy loading (load bundles as one’s\u00a0need), bundle splitting (separate app\/vendor bundles), hashing (to bust cache) and source maps (so it’s easy to debug minified versions). \u00a0Webpack solves fundamental problem of web development \u00a0very well. It seems that people are pushing common build related concerns to tooling hiding the current complexity.<\/p>\n

 <\/p>\n

Earlier with Grunt and Gulp one\u00a0had to do a lot of manual work to achieve the same output. So, Webpack \u00a0solves the hard part.\u00a0Webpack’s approach is more involved and it comes with a learning curve as it relies on configuration and looks very different than other tools. \u00a0Webpack boasts a bunch of features:<\/p>\n