nuxt: PostCSS plugins don't do anything

I’m trying to add some PostCSS plugins. Currently trying to get pxtorem working, but my compiled CSS is unchanged. Here’s the relevant config:

module.exports = {
  css: [
    { src: '~assets/scss/main.scss', lang: 'scss' }
  ],

  build: {
    postcss: [
      require('postcss-pxtorem')({
        propList: ['*']
      })
    ]
  }
}

<div align="right">_{This bug report is available on Nuxt.js community (#c966)}</div>

About this issue

Original URL
State: closed
Created 7 years ago
Comments: 18 (2 by maintainers)

Most upvoted comments

Please upgrade to rc5 😃

https://github.com/nuxt/nuxt.js/releases/tag/v1.0.0-rc5

Atinux on Aug 21, 2017

@benjarwar of course not.

this is my config.

sass-resources-loader & postcss-loader can use in vue & scss.

but need add a postcss.config.js in root dir, for the line 42.
// I can’t find a better way to reuse the postcss config in nuxt.config.js for now.

last, sometimes run dev will console some error about scss, but pages still normal.

hope somebody can tell me why. LOL

didiself on Jul 21, 2017

Thanks, @pi0 and @Atinux!

benjarwar on Aug 23, 2017

@benjarwar I was stumbling into the same - postcss plugins configured just fine in nuxt.config.js, but my css was not getting processed whatsoever. I was using nuxt.config.jss css field to specify my global css file.

However, I got it to work now by still using the config file to set postcss options, but to include my css from ie pages/index.vue using just the style element(without lang attr!).

Kinda like this

# pages/index.vue

...

<style>
@import "../styles/index.css";
</style>

...

# nuxt.config.js

...

build: {
    postcss: [
      require('postcss-easy-import')(),
      require('postcss-custom-properties')(),
      require('postcss-calc')(),
      require('postcss-custom-media')(),
    ]
  }

...

You probably could use a layout file to mimic the global behavior, as well(not tested).

Hope that helps!

btw in your above post, you got a typo: lang: 'scss'?!

casio on Jul 19, 2017