How vue removes redundant styles

This article mainly introduces vue how to remove redundant styles, has a certain reference value, interested friends can refer to, I hope you can learn a lot after reading this article, the following let Xiaobian take you to understand.

Remove redundant styles

As the project becomes larger and larger, careless writing will lead to some extra css. Small projects are fine. Once the project is big, the excess css will become more and more, resulting in larger and larger packages, thus affecting the performance of the project. Therefore, it is necessary to remove these redundant css in the formal environment. A library purgecss is recommended here, which supports CLI, JavascriptApi, Webpack and other ways. Through this library, We can easily get rid of the excess css.

Hello vanillared We use Parcel to bundle this sandbox, you can find more info about Parcelhere.body {font-family: sans-serif;} a {color: red;} ul {li {list-style: none;}} import Purgecss from "purgecss"; const purgecss = new Purgecss ({content: ["* / * .html"], css: ["* * / * .css"]}); const purgecssResult = purgecss.purge ()

The final purgecssResult result is as follows. You can see that the styles of the redundant an and ul tags are gone.

Thank you for reading this article carefully. I hope the article "how to remove redundant patterns of vue" shared by the editor will be helpful to everyone. At the same time, I also hope that you will support us and pay attention to the industry information channel. More related knowledge is waiting for you to learn!