Раньше использовал node-sass@8.0.0 но по некоторым причинам пришлось отказаться от него (на машине которая собирает проект стоит python 3.5 и обновить его не вариант), гуглил последнюю версию node-sass которая работает до python 3.6 но толкового ничего не нашел так что пришлось перекатить с node sass к dart-sass (sass) но после посыпались ошибки, как будто sass не умеет работать с файлами .scss, (для ясности nodejs версии 14.15) вот лог ошибки
WARNING in ./src/sass/main.sass (./src/sass/main.sass.webpack[javascript/auto]!=!./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./node_modules/postcss-loader/dist/cjs.js!./n
ode_modules/resolve-url-loader/index.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[4]!./src/sass/main.sass)
Module Warning (from ./node_modules/sass-loader/dist/cjs.js):
This selector doesn't have any properties and won't be rendered.
null
@ ./src/sass/main.sass
WARNING in ./src/sass/main.sass (./src/sass/main.sass.webpack[javascript/auto]!=!./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./node_modules/postcss-loader/dist/cjs.js!./n
ode_modules/resolve-url-loader/index.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[4]!./src/sass/main.sass)
Module Warning (from ./node_modules/sass-loader/dist/cjs.js):
This selector doesn't have any properties and won't be rendered.
null
@ ./src/sass/main.sass
...
ERROR in ./src/sass/main.sass (./src/sass/main.sass.webpack[javascript/auto]!=!./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./node_modules/postcss-loader/dist/cjs.js!./nod
e_modules/resolve-url-loader/index.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[4]!./src/sass/main.sass)
Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: semicolons aren't allowed in the indented syntax.
╷
51 │ background-image: url("data:image/svg+xml,%3Csvg width='23' height='53' viewBox='0 0 23 53' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L21 26.5L1 52' stroke
='%23113A60' stroke-width='1.6'/%3E%3C/svg%3E%0A");
│
^
╵
src\sass\components\_history-company.sass 51:238 @import
src\sass\components\module.scss 26:9 @import
src\sass\main.sass 3:9 root stylesheet
SassError: SassError: semicolons aren't allowed in the indented syntax.
╷
51 │ background-image: url("data:image/svg+xml,%3Csvg width='23' height='53' viewBox='0 0 23 53' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L21 26.5L1 52' stroke
='%23113A60' stroke-width='1.6'/%3E%3C/svg%3E%0A");
│
^
╵
src\sass\components\_history-company.sass 51:238 @import
src\sass\components\module.scss 26:9 @import
src\sass\main.sass 3:9 root stylesheet
at Object.loader (...\webpack\node_modules\sass-loader\dist\index.js:69:14)
@ ./src/sass/main.sass
ERROR in ./src/sass/main.sass
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
HookWebpackError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: semicolons aren't allowed in the indented syntax.
╷
51 │ background-image: url("data:image/svg+xml,%3Csvg width='23' height='53' viewBox='0 0 23 53' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L21 26.5L1 52' stroke
='%23113A60' stroke-width='1.6'/%3E%3C/svg%3E%0A");
│
^
╵
...
Generated code for [...]\webpack\node_modules\css-loader\dist\cjs.js??ruleSet[1].rules[0].use[1]![...]\webpack\node_modules\postcs
s-loader\dist\cjs.js![...]\webpack\node_modules\resolve-url-loader\index.js![...]\webpack\node_modules\sass-loader\dist\cjs.js??ru
leSet[1].rules[0].use[4]![...]\webpack\src\sass\main.sass
1 | throw new Error("Module build failed (from ./node_modules/sass-loader/dist/cjs.js):\nSassError: semicolons aren't allowed in the indented syntax.\n ╷\n51 │ background-image: ur
l(\"data:image/svg+xml,%3Csvg width='23' height='53' viewBox='0 0 23 53' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L21 26.5L1 52' stroke='%23113A60' stroke-width='1.6'/%3
E%3C/svg%3E%0A\");\r\n │
^\n ╵\n src\\sass\\components\\_history-company.sass 51:238 @import\n src\\sass\\components\\module.scss 26:9
@import\n src\\sass\\main.sass 3:9 root stylesheet");
webpack 5.74.0 compiled with 2 errors and 21 warnings in 1128 ms
package.json
{
"name": "[...]",
"version": "1.0.0",
"description": "",
"main": "webpack.config.js",
"sass": "./src/sass/main.scss",
"scripts": {
"dev": "webpack --mode=development --config webpack.config.js",
"build": "webpack --mode=production --config webpack.config.js"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"bootstrap-scss": "^5.2.2",
"dompurify": "^2.4.1",
"intl-tel-input": "^17.0.19",
"jquery": "^3.6.0",
"jquery-mask-plugin": "^1.14.16",
"owl.carousel": "^2.3.4",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"setimmediate": "^1.0.5"
},
"devDependencies": {
"@babel/core": "^7.19.1",
"@babel/preset-env": "^7.19.1",
"@babel/preset-react": "^7.18.6",
"@types/dompurify": "^2.4.0",
"@types/intl-tel-input": "^17.0.5",
"@types/jquery": "^3.5.14",
"@types/jquery-mask-plugin": "^1.14.4",
"@types/owl.carousel": "^2.3.3",
"@types/react": "^18.0.20",
"@types/react-dom": "^18.0.6",
"@types/setimmediate": "^1.0.2",
"@typescript-eslint/eslint-plugin": "^5.37.0",
"@typescript-eslint/parser": "^5.37.0",
"autoprefixer": "^10.4.13",
"babel-loader": "^8.2.5",
"css-loader": "^6.7.2",
"css-minimizer-webpack-plugin": "^4.2.2",
"fibers": "^5.0.3",
"mini-css-extract-plugin": "^2.7.0",
"postcss": "^8.4.19",
"postcss-loader": "^7.0.1",
"postcss-preset-env": "^7.8.3",
"resolve-url-loader": "^5.0.0",
"sass": "^1.56.1",
"sass-loader": "^13.2.0",
"terser-webpack-plugin": "^5.3.5",
"ts-loader": "^9.3.1",
"typescript": "^4.8.3",
"webpack": "^5.74.0",
"webpack-cli": "^4.10.0"
},
"browserslist": {
"production": [
"ie >= 8",
"last 5 version"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
Сложный
Простой
