Issues with parcel and custom animations

[joeattardi]

I'm using a really simple setup with Parcel as the bundler.

When I run parcel build styles.css, it generates the minimal CSS file only containing the classes used, plus the custom animations I added in the Tailwind configuration (see below)

However, when I run parcel watch styles.css it generates the huge ~2MB CSS file with everything, and doesn't contain my animation classes.

Only fix I can come up with is to do NODE_ENV=production parcel watch styles.css - is there some configuration option I can set so I don't have to do this?

Tailwind config:

const defaultTheme = require('tailwindcss/defaultTheme');

module.exports = {
  purge: ["./views/**/*.html"],
  theme: {
    extend: {
      fontFamily: {
        sans: ['Source Sans Pro', ...defaultTheme.fontFamily.sans]
      },
      keyframes: {
        'profile-appear': {
          '0%': {
            opacity: '0',
            transform: 'perspective(500px) rotateX(90deg)'
          },
          '100%': {
            opacity: '1',
            transform: 'perspective(500px) rotateX(0deg)'
          }
        }
      },
      animation: {
        'profile-appear': 'profile-appear 500ms ease-in-out'
      }
    },
  },
  variants: {},
  plugins: [],
  future: {
    removeDeprecatedGapUtilities: true,
  },
};

PostCSS config:

module.exports = { 
  theme: {}, 
  variants: {}, 
  plugins: [ 
      require('tailwindcss') 
  ] 
}