Compress CSS file in NUXT

Question

I have a website made with NUXT (VUE framework) and when compiling it, it doesn't compress the CSS files, giving me a very long HTML code.

https://www.tiroconarco.link/

I generate the files with a yarn generate, I suppose that I must put something in the configuration files so that it compresses the CSS.

Can you help me?

Thanks

The css in your website is its minified version. What do you mean by compressing? — Mani Mirjavadi
– Mani Mirjavadi, Commented Feb 17, 2022 at 9:02
Under the commented information of Github, start a code " html{box-sizing:border-box;overflow-y:scroll; ......... " — Xavier Bernadi
– Xavier Bernadi, Commented Feb 17, 2022 at 9:14

Nicolas Pennec · Accepted Answer · 2022-02-17 10:10:12Z

3

Your CSS contents are already compressed by the Nuxt build process. But stylesheets are inlined in your HTML page for performance purpose, to avoid loading another CSS file.

(see default optimization options)

You can extract all your CSS to an external single file by configuration as below:

// nuxt.config.js

export default {
  build: {
    extractCSS: true
  }
}

See more about extractCSS on docs: https://nuxtjs.org/docs/configuration-glossary/configuration-build/#extractcss

answered Feb 17, 2022 at 10:10

Nicolas Pennec

7,62132 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Compress CSS file in NUXT

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related