search

creativetimofficial / ct-vuetify-material-dashboard-pro

Vuetify Material Dashboard Pro - Premium Admin Template
https://demos.creative-tim.com/vuetify-material-dashboard-pro
27 stars 6 forks source link

[Bug] CSS/layout differs in dev and production build #50

Closed travisbotello closed 3 years ago

travisbotello commented 3 years ago

Version

2.1.0

Reproduction link

https://github.com/creativetimofficial/ct-vuetify-material-dashboard-pro

Operating System

macOS

Device

MBP

Browser & Version

87.0.4280.141

Steps to reproduce

  1. Download repository
  2. Run yarn
  3. Run yarn server
  4. Open browser window
  5. Run yarn build
  6. Open build in browser window
  7. Compare output => You can see that the padding of elements as well as some colors differ in dev and production builds. Obviously with current build setup vuetify.css rules are moved from top to bottom in production build.

    What is expected?

    Output should be exactly the same in dev and production builds.

    What is actually happening?

    Output is different in dev and production build.

Solution

Screenshot with yarn serve: https://www.dropbox.com/s/26pmy1og2fgxyvn/Bildschirmfoto%202021-01-22%20um%2012.25.29.png?dl=0 Screenshot with yarn build: https://www.dropbox.com/s/osxljdp0brlj6tg/Bildschirmfoto%202021-01-22%20um%2012.24.39.png?dl=0

Additional comments

johnleider commented 3 years ago

This issue is resolved in the latest version. It stems from an issue with Vuetify related to CSS ordering after build.