Replace SCSS with LESS

This is how to run LESS files through Webpack instead of SCSS files:

Install new dependencies

Install LESS modules by running the following command from the directory where the package.json file is located:

npm install --save-dev less-loader less

Update Webpack config

In webpack.config.js, update...

- test: /\.s?css$/,
+ test: /\.less$/,

- loader: 'sass-loader',
+ loader: 'less-loader',
  options: {
-   includePaths: [
+   paths: [
      CONFIG.aem.jcrRoot + '/apps/' + CONFIG.aem.projectFolderName + '/components/webpack.resolve/'
    ],
  },

- extensions: ['.js', '.scss'],
+ extensions: ['.js', '.less'],

Cleanup

Remove the no longer relevant postinstall script from your package.json. It looks like this:

- "postinstall": "npm rebuild node-sass",

Remove no longer needed dependencies:

npm uninstall sass-loader node-sass