How to implement react static scss into project?

Question

I am using static react template and need to implement scss. my git hub sample : https://github.com/PrasanthGokuldas/Test_ReactStatic.git i tried to add react-static-plugin-sass to package.json and included in static.config.js file as

plugins: ['react-static-plugin-sass']

but i am unable to access scss file to project.

Answer 1

Once you have added react-static-plugin-sass using yarn or npm, you need to add it to the top of your plugins array (static.config.js) as follows:

plugins: [
    require.resolve('react-static-plugin-sass'),
    [
        require.resolve('react-static-plugin-source-filesystem'),
        {
            location: path.resolve('./src/pages'),
        },
    ],
    require.resolve('react-static-plugin-reach-router'),
    require.resolve('react-static-plugin-sitemap'),
],

Then all you need to do is start writing your Sass in your app.scss file and import app.scss in your App.js.