Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 1 year ago.
Improve this question
All the project gets affected by changes I make in any CSS file even if it's not imported to that file.
for example: If I created a file called test1.js and imported a file called test.css inside of it then created a new file called test2.js and gave the same classes to its components they get styled the same way as test1.js even without importing the CSS file into it.
How can I get around this problem? is using SASS away to avoid it?
Can you please recommend the best practice for styling in react?
Related
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 7 days ago.
Improve this question
So... My pages were all done. Everything and every CSS running smoothly... And then I added my routes. Apparently my main route "/" managed to load every css file from my routes and now Im not sure what to do?
I looked it up and found some people talking about absolute pathing my styles. Didn't really work thou... Also tried to inspect and make sure nothing was overwriting my styles... I'm using reactjs. You guys have some tip for me?
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed last year.
Improve this question
So for example for the HTML we have the index.html file on the public folder that we can clearly see. Now my question is how bout CSS. I have CSS for each of my components of a react application but I want to use things like variables and constants that run across an application.
Someone explain this to me.
You should define all variables and constants that you want to use across your project, in one file and import in App.js or index.js as a css file.
App.js
import "./style.css"
styles (classes) that you define in this file, are accessed all over your project.
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 3 years ago.
Improve this question
Kindly see the option that I've tried which dont worked out for me.
You can right-click on the file in Prepros and select Disable Auto Compile.
I don't want anything processed except for my "main.scss" file. Is there a way to prevent Prepos from processing certain scss files
For all other files except for main.scss, add "_" before the name.
They are called partials. For example _variables.scss, _header.scss or _footer.scss and include them all in the beginning of the main.scss file
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 3 years ago.
Improve this question
I'm new in reactJs and I'm using webpack-dev-server to compile and check my code, the problem is that when I add a stylesheet to the sources as an imported file in the result everything is shown well and also in the output folder with the plugin I've imported the bundle.js file update but there is no sign of stylesheet file
My question is that what happened to the css file ? is that necessary to be there? or the styles are composed by the output js file? because when i moved the file it works fine again without any problem.
tnx
In production you probably wants to include all your CSS in one bundle file minifiying the result and exclude all CSS files not minified you used for actual development.
To do this you could use a CSS Loader, there are several options, one could be:
https://github.com/webpack-contrib/css-loader
An interesting article, it should help you to get started:
https://medium.com/trabe/multiple-css-bundles-with-webpack-75f263095f09
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I often need to use some styles from a website but i cant find those style sheets since it is linked using an import function. can anyone say how to download/view those imported style sheets.
Here is what you can do. Depending on which browser you use you can activate developer tools in the settings. You can then right klick on a part of the website you want to have the styles from and often times it says something like "inspect element" in the menu. You will then be able to view the styles that are applied to this specific element or webpage and you will also be able to copy those to the clipboard.
I actually hope this will be of help to you.
https://developers.google.com/chrome-developer-tools/