Bharat Tiwari in A beginner’s guide to Webpack 2

Copy all images/files to a folder using copy-webpack-plugin

In the previous lessons we saw how to use url-loader andfile-loader that allow webpack to bundle/pack images used in our web application. For webpack to know what images our application uses, we have to let webpack know of…

10 responses

Bharat Tiwari in A beginner’s guide to Webpack 2

May 24, 2017

File-loader for large size images

In the previous lesson, we saw how to use url-loader in webpack to bundle images, smaller than the…

8 responses

Bharat Tiwari in A beginner’s guide to Webpack 2

May 20, 2017

Handling Images

Usually there are two ways the images are used in a web application — using the <img> tag in the HTML or thru css by setting…

9 responses

Bharat Tiwari in A beginner’s guide to Webpack 2

May 12, 2017

Extract Text Plugin

In the last lesson, we got our styles working all good; getting the css and scss files bundled and then getting the resulting css included within the <style> tags. While this is okay at this point of the beginning of the development phase while we have very little css , but as our css will…

4 responses

Bharat Tiwari in A beginner’s guide to Webpack 2

May 11, 2017

Using SASS

Now, lets also add a .scss file and try to bundle it with webpack using sass-loader.

Under the ./src/styles folder, add a couple of .scss files as below:

./src/styles/themeColors.scss

2 responses

Bharat Tiwari in A beginner’s guide to Webpack 2

May 10, 2017

Webpack Loaders, CSS and Style Loaders

Let’s see how to get our styles - css and sass files - bundled in our webpack application package.

Loaders

Webpack by itself only knows javascript, so when we want it to pack any other type of resources…

12 responses

Bharat Tiwari in A beginner’s guide to Webpack 2

May 10, 2017

Hot Module Replacement

During development, lets say you have your application opened in your browser window, and you have navigated to page or state of step 3 of some multi-step process when you realize that you need to change some style or some functionality of a module used in step 3.

1 response

Bharat Tiwari in A beginner’s guide to Webpack 2

May 7, 2017