如何在laravel-mix中使用vuetify点菜？

Question

我想在laravel-mix中使用Vuetify a-la-carte方法。

我一直在阅读docs以及此有用的post。

这是我的完整webpack.mix.js配置：

const mix = require('laravel-mix');
const VuetifyLoaderPlugin = require('vuetify-loader/lib/plugin');
 mix.webpackConfig({
   externals: {
    vue: 'Vue'
  }
 });

mix.options({
    extractVueStyles: 'public/css/components.css',
    purifyCss: true,
});

mix.webpackConfig({
       plugins: [
           new VuetifyLoaderPlugin({
               options: {}
           }),
       ]
   })
.js('resources/assets/js/voyager.js', 'public/js')

这会将js编译为public/js/voyager.js中的有效文件，以及将CSS编译为public/css/components.css中的css。

但是，voyager.js包含vuetify的所有组件。我在文件中仅使用v-alert。 VuetifyLoaderPlugin的目的是仅加载我实际使用的组件。文件voyager.js已缩小，但仍大623 kb。

我想念的是什么？为什么VuetifyLoaderPlugin不起作用？

Answer 1

所以我认为您已经做了npm run production，但您的voyager.js没有缩小？

[Afaik混用，缩小只会在生产版本（npm run production）中进行。