Tailwindcss-module: npm run build "PurgeCSS is not enabled because you are in dev mode"

Created on 9 Jan 2020  Â·  2Comments  Â·  Source: nuxt-community/tailwindcss-module

I created a nuxt app with npx create-nuxt-app <project-name>. I choosed tailwind as the css framework. Here is my default nuxt.config.js

export default {
  mode: 'universal',
  /*
  ** Headers of the page
  */
  head: {
    title: process.env.npm_package_name || '',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: process.env.npm_package_description || '' }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ]
  },
  /*
  ** Customize the progress-bar color
  */
  loading: { color: '#fff' },
  /*
  ** Global CSS
  */
  css: [
  ],
  /*
  ** Plugins to load before mounting the App
  */
  plugins: [
  ],
  /*
  ** Nuxt.js dev-modules
  */
  buildModules: [
    // Doc: https://github.com/nuxt-community/nuxt-tailwindcss
    '@nuxtjs/tailwindcss',
  ],
  /*
  ** Nuxt.js modules
  */
  modules: [
    // Doc: https://axios.nuxtjs.org/usage
    '@nuxtjs/axios',
  ],
  /*
  ** Axios module configuration
  ** See https://axios.nuxtjs.org/options
  */
  axios: {
  },
  /*
  ** Build configuration
  */
  build: {
    /*
    ** You can extend webpack config here
    */
    extend (config, ctx) {
    }
  }
}

If I used npm run build the console output shows PurgeCSS is not enabled because you are in dev mode.

Next I added cross-env to the project and added the cross-env command to the package.json:

  "scripts": {
    "dev": "nuxt",
    "build": "cross-env NODE_ENV=production nuxt build",
    "start": "nuxt start",
    "generate": "nuxt generate"
  },

If I run npm run build the console shows the same output PurgeCSS is not enabled because you are in dev mode.

> cross-env NODE_ENV=production nuxt build

i Production build                                                                                                                                                          13:23:20  
start Loading module                                                                                                                                          nuxt-purgecss 13:23:20  
i PurgeCSS is not enabled because you are in dev mode                                                                                                         nuxt-purgecss 13:23:20  
√ Builder initialized                                                                                                                                                       13:23:20  
√ Nuxt files generated   

Same issue, when I added this to nuxt.config.js:

    purgeCSS: {
        enabled: true
    }

Most helpful comment

I similarly have this issue, it appears to have been broken in this commit: https://github.com/nuxt-community/tailwindcss-module/commit/9fe24f7cbad6a000a13b4eaef8ca40f83c0570e8 where now purgeCSS can only be enabled in any env if purgeCSSinDev is true. This is easily reproducible with the latest versions of each nuxt and @nuxtjs/tailwindcss.

For now the workaround appears to be adding

tailwindcss: {
    purgeCSSInDev: process.env.NODE_ENV === 'production',
  }

to your nuxt.config.js file

All 2 comments

I similarly have this issue, it appears to have been broken in this commit: https://github.com/nuxt-community/tailwindcss-module/commit/9fe24f7cbad6a000a13b4eaef8ca40f83c0570e8 where now purgeCSS can only be enabled in any env if purgeCSSinDev is true. This is easily reproducible with the latest versions of each nuxt and @nuxtjs/tailwindcss.

For now the workaround appears to be adding

tailwindcss: {
    purgeCSSInDev: process.env.NODE_ENV === 'production',
  }

to your nuxt.config.js file

Really sorry about this, it's now fixed in v1.3.1

Was this page helpful?
0 / 5 - 0 ratings

Related issues

miketromba picture miketromba  Â·  4Comments

toxin20 picture toxin20  Â·  4Comments

sbkl picture sbkl  Â·  4Comments

Zenthae picture Zenthae  Â·  9Comments

richeduni picture richeduni  Â·  5Comments