CODEWITHSUNDEEP
cssreactjswebpack
mohammad chughtai
mohammad chughtai

Reputation: 1964

How can I overwrite styles from a css framework while using webpack?

I'm using a CSS framework for my app but want to overwrite certain styles. Normally I would do something like:

<link rel='stylesheet' href='link to framework'>
<link rel='stylesheet' href='my own stylesheet'>

so my stylesheet overwrites any pre-framework-written stylesheet. But react doesn't have a link to src/app.css so I'm not sure what to do and couldn't find this in their docs.

*Note: I would like to not use !important because I have found this to be troubling while dealing with site maintenance.

Upvotes: 1

Views: 994

Answers (1)

Shubham Khatri
Shubham Khatri

Reputation: 281744

In order to override your framework styles you can configure your webpack if you are using it with css-loader like

 {
        test: /\.(scss|css)$/,
        use: ['style-loader', 'css-loader']

    }

and import your styles in your App component like

import './path/to/app.css'

Upvotes: 1

Related Questions