Configuring Webpack for React Development

Introduction

React là một thư viện front-end khá phổ biến và được sử dụng khá nhiều trong các ứng dụng web hiện đại. Nếu tìm kiếm trên Viblo, chắc hẳn bạn sẽ thấy khá nhiều bài viết hay về React. Tương tự như React, Webpack là một công cụ module bundler đang phát triển khá nhanh trong thời gian gần đây và dần thay thế Gulp - một công cụ task runner truyền thống, hay Browserify một công cụ có chức năng tương tự như Webpack.

Trong bài viết này, mình sẽ giới thiệu về cách sử dụng Webpack để xây dựng một build process cho các ứng dụng React sử dụng npm, Webpack, và Babel. Ngoài ra mình cũng sẽ giới thiệu cách cài đặt Webpack Dev Server cũng như Hot Module Reloading khi làm việc với React.

Cách cài đặt này mình thường sử dụng cho các project cá nhân hoặc khi muốn experiment với một thứ gì mới ở React. Mình cũng sẽ không đi sâu vào việc giải thích các programming jargons (như trong những bài viết trước