search

creativetimofficial / argon-dashboard-react

React version of Argon Dashboard
MIT License
443 stars 751 forks source link

[Bug] SCSS files are appearing in the browser even after removing from build #50

Closed vikasr111 closed 3 years ago

vikasr111 commented 3 years ago

Version

1.1.0

Reproduction link

http://emotify-web.herokuapp.com/users/sign_in Open this link and inspect the button to see the repeating and conflicting CSS

Operating System

All OS

Device

All Devices

Browser & Version

All Browsers

Steps to reproduce

  1. Download Argon React Dashboard
  2. Use compiled CSS imports
  3. Create production build and serve
  4. Inspect any button or other element in the browser
  5. Notice repeating CSS rules from compiled CSS and SCSS files

    What is expected?

    Should only load compiled CSS files as referenced in the build process. Should not show SCSS files reference and rules in the browser.

    What is actually happening?

    Showing both compiled and SCSS files with repeating and sometimes conflicting CSS rules which cause UI issues.

    Screenshot

    Conflicting CSS rules

Solution

Additional comments

vikasr111 commented 3 years ago

Is there any solution to this problem?

I have noticed that the live demo of Argon Dashboard React does not have this issue. So there must be some missing steps in the build process that have not been added in the documentation. https://demos.creative-tim.com/argon-dashboard-react/#/admin/index

Kindly help with this issue.

einazare commented 3 years ago

Hello there, @vikasr111 ,

Thank you for your interest in working with our products, and sorry for this late reply. We've had a lot of work to do these days, we also had a few days off for the New Year and Christmas holiday.

Download Argon React Dashboard Use compiled CSS imports Create production build and serve Inspect any button or other element in the browser Notice repeating CSS rules from compiled CSS and SCSS files

I have a question here. What do you mean by Use compiled CSS imports? Also, I think it would be best if you could provide me here with your code.

I am asking this, since I downloaded the product, changed the usage of SCSS to CSS, and everything worked as expected. I could give you a few screenshots, but they would be pointless.

Will wait for your reply.

Best, Manu

vikasr111 commented 3 years ago

Referring to the getting-started instruction of importing compiled scss as shown in the screenshots.

Screenshot 2021-01-06 at 7 25 20 PM

We created the local build and also tried uploading on Heroku. In both scenarios, it shows duplicate css rules. One set from argon-dashboard-react.css and another set from bootstrap.css (Or scss files)

Hope this helps in figuring out or replicating the issue.

einazare commented 3 years ago

Hello again, @vikasr111 ,

Can you show me the code?

Best, Manu