Всем привет. Пытаюсь скомпилировать scss файлы в один css файл в папке app. По итогу получают ошибку в консоли
"Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema.
- configuration.module has an unknown property 'loaders'. These properties are valid:
object { defaultRules?, exprContextCritical?, exprContextRecursive?, exprContextRegExp?, exprContextRequest?, generator?, noParse?, parser?, rules?, strictExportPresence?, strictThisContextOnImports?, unknownContextCritical?, unknownContextRecursive?, unknownContextRegExp?, unknownContextRequest?, unsafeCache?, wrappedContextCritical?, wrappedContextRecursive?, wrappedContextRegExp? }"
package.json
{
"name": "lets-eat",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"build": "webpack"
},
"author": "",
"license": "ISC",
"dependencies": {},
"devDependencies": {
"@babel/cli": "^7.13.16",
"@babel/core": "^7.13.16",
"@babel/node": "^7.13.13",
"@babel/preset-env": "^7.13.15",
"babel": "^6.23.0",
"extract-text-webpack-plugin": "^3.0.2",
"sass-loader": "^11.0.1",
"webpack": "^5.35.0",
"webpack-cli": "^4.6.0",
"webpack-loaders": "^1.0.0"
}
}
webpack.config.js
const path = require("path");
const ExtractTextPlugin = require("extract-text-webpack-plugin");
let extract = (style, type) => ExtractTextPlugin.extract(style, type);
module.exports = {
mode: "production",
entry: "./script/main.js",
output: {
path: path.resolve(__dirname, "app/js"),
filename: "bundle.js"
},
plugins: [
new ExtractTextPlugin("bundle.css")
],
module: {
rules: [
{
test: /\.css$/,
loader: extract("style", "css")
},
{
test: /\.scss$/,
loader: extract("style", "css!sass")
}
]
}
}
Уже изменял с loaders на rules и на оборот