The scss file in not compiling in reactjs even after having the required dev dependencies .I have used create-react-app to create the app. Here is the package.json file.
{
"name": "mydecisionapp",
"version": "0.1.0",
"private": true,
"dependencies": {
"css": "^2.2.1",
"loader": "^2.1.1",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-modal": "^3.1.11",
"react-scripts": "1.1.0",
"style": "^0.0.3",
"validator": "8.0.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
},
"devDependencies": {
"css-loader": "^0.28.9",
"node-sass": "^4.7.2",
"sass-loader": "^6.0.6",
"style-loader": "^0.20.1",
"webpack": "^3.10.0"
}
}
Here is the package style.scss file .
$brand-color:blue;
* {
color: $brand-color;
}
I looked at all imports in index.js file and it is completely ok but still, I don't see scss compiling .
create-react-app is not configured by default to support scss files. Try reading this How to add SASS/SCSS to a create-react-app
Pls ensure that your version of react-scripts inside the the package.json file is at least 2.0.0.
This is stated at the top of the documentation that can be found here: https://create-react-app.dev/docs/adding-a-sass-stylesheet
Note: this feature is available with react-scripts@2.0.0 and higher.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.