Как заменить в webpack.config/package.json less на sass?

Question

[Alex Polyakh]

Доброе время суток. У меня есть готовая сборка, необходимо делать проект срочно, нет сейчас возможности разобраться в webpack. Помогите пожалуйста заменить препроцессор less на sass(scss). Спасибо больше. webpack.config.js и
package.json доступны на codepen.
webpack.config.js:
https://codepen.io/PolyakhAlex/pen/LjWQqe?editors=1010
package.json:
https://codepen.io/PolyakhAlex/pen/LjWQqe?editors=1010

Comments

[Сергей Новиков]

Ссылку поправьте на webpack.config.js, а то самого главного и нет.

[Alex Polyakh]

Сергей Новиков: Прошу прощения, добавил. Посмотрите пожалуйста когда будет у вас время!

Answer 1

[Сергей Новиков]

В package.json замените:

less -> node-sass
less-loader -> sass-loader

В webpack.config.js замените:

{
    test: /\.less$/,
    loader: 'style' +
    '!css?sourceMap' +
    '!autoprefixer-loader?browsers=last 2 version' +
    '!less?sourceMap=source-map-less-inline'
}

на

{
    test: /\.scss$/,
    loader: 'style-loader' +
    '!css-loader?sourceMap' +
    '!autoprefixer-loader?browsers=last 2 version' +
    '!sass-loader?sourceMap'
}

Однако есть одно но: используется 1я версия webpack, поэтому нужно установить соответствующую версию sass-loader (возможно 4.1.1). Из-за этого же возможно будет ругаться на префиксы (css -> css-loader).

Comments

[Alex Polyakh]

Сергей Новиков, спасибо Вам!