How to edit webpack to use scss in react app?

@muriel.schmidt 

To edit webpack to use SCSS in a React app, you will need to configure the webpack configuration file to include a loader for SCSS files. Here is how you can do it:

1. Install necessary dependencies: Before you start, make sure you have sass-loader, node-sass, and style-loader installed in your project. You can install them using npm or yarn: npm install sass-loader node-sass style-loader --save-dev
2. Update webpack configuration file: Open your webpack.config.js file and add a rule for SCSS files in the module section. Here is an example configuration: module.exports = { // other webpack configuration settings module: { rules: [ { test: /.scss$/, use: [ 'style-loader', 'css-loader', 'sass-loader' ] } ] } };
3. Import SCSS files in your React components: Now, you can import SCSS files in your React components like this: import './styles.scss';
4. Start webpack dev server: Once you have updated the webpack configuration file, start your webpack dev server to see your SCSS styles applied to your React components.

That's it! You have now configured webpack to use SCSS in your React app. You can now create and import SCSS files in your project to style your components.