1

I add purgecss-webpack-plugin to my vuetify application.

The problem is purgecss-webpack-plugin remove all vuetify styles.

This is how I config purgecss-webpack-plugin in vue.config.js:

const PurgecssPlugin = require('purgecss-webpack-plugin');
const glob = require('glob-all');
const path = require('path');
...
    configureWebpack: {
     plugins: [
          new PurgecssPlugin({
            paths: glob
              .sync([
                path.join(__dirname, './src/index.html'),
                path.join(__dirname, './**/*.vue'),
                path.join(__dirname, './src/**/*.js'),
                path.join(__dirname, './node_modules/vuetify/**/*.js'),
              ])
              .filter((f) => !/\/$/.test(f)),
         }),
     ]
    }

App.vue

<v-app>
  <v-content>
    <v-btn color="primary">button</v-btn>
  </v-content>
</v-app>

After I run build, it remove most of vuetify styles: v-application v-application--is-ltr theme--light, .v-btn.

How I tell purgecss to remove styles I don't need but to be smart and detect those I need?

Jon Sud
  • 10,211
  • 17
  • 76
  • 174

0 Answers0