Compile SASS and build JS with Webpack

If You’ve tried SASS before You don’t want to write a single line of CSS anymore. Webpack is an awesome tool that builds and minify the JavaScipt and CSS files.

How to use Webpack with SASS Loader?

Open the terminal at the project folder

Step 1 – Initialize package.json

npm init -y

Step 2 – Install the following packages:

• Webpack
• Webpack-CLI
• Sass Loader
• Node Sass

npm install --save-dev webpack webpack-cli sass-loader node-sass

Your package.json going to be look like this

It is going to be generated, so You don’t need to copy the content.

Step 3 – Create a file named webpack.config.js

Step 4 – Run webpack and watch for changes

npx webpack --watch