vuetifyjs-mix-extension icon indicating copy to clipboard operation
vuetifyjs-mix-extension copied to clipboard

Doesn’t work as per docs

Open martinbean opened this issue 3 years ago • 0 comments

I’m trying to get tree shaking working in a Laravel project that uses Laravel Mix. Here are my files:

// app.js
import Vue from 'vue';
import vuetify from './plugins/vuetify';

Vue.config.productionTip = false;

Vue.component('login-page', () => import('./components/LoginPage.vue'));

new Vue({
  vuetify,
}).$mount('#app');
// resources/js/plugins/vuetify.js
import Vue from 'vue';
import Vuetify from 'vuetify/lib';
import 'vuetify/dist/vuetify.min.css';

Vue.use(Vuetify);

export default new Vuetify({});
// webpack.mix.js
const mix = require('laravel-mix');

require('vuetifyjs-mix-extension');

mix
  .js('resources/js/app.js', 'public/js')
  .vuetify('vuetify-loader')
  .vue();

When I try and run any Mix script (npm run dev, npm run watch, etc) I just get the following error:

[webpack-cli] Error: Cannot find module 'vuetify-loader/lib/plugin'
Require stack:
- <root>/node_modules/vuetifyjs-mix-extension/index.js
- <root>/webpack.mix.js
- <root>/node_modules/laravel-mix/setup/webpack.config.js
- <root>/node_modules/webpack-cli/lib/webpack-cli.js
- <root>/node_modules/webpack-cli/lib/bootstrap.js
- <root>/node_modules/webpack-cli/bin/cli.js
- <root>/node_modules/webpack/bin/webpack.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:902:15)
    at Function.Module._load (internal/modules/cjs/loader.js:746:27)
    at Module.require (internal/modules/cjs/loader.js:974:19)
    at require (internal/modules/cjs/helpers.js:92:18)
    at Vuetify.addVuetifyLoader (<root>/node_modules/vuetifyjs-mix-extension/index.js:90:37)
    at Vuetify.webpackConfig (<root>/node_modules/vuetifyjs-mix-extension/index.js:80:44)
    at <root>/node_modules/laravel-mix/src/components/ComponentRegistrar.js:124:54
    at <root>/node_modules/laravel-mix/src/Dispatcher.js:39:62
    at Array.map (<anonymous>)
    at Dispatcher.fire (<root>/node_modules/laravel-mix/src/Dispatcher.js:39:47)
    at Mix.dispatch (<root>/node_modules/laravel-mix/src/Mix.js:250:32)
    at WebpackConfig.build (<root>/node_modules/laravel-mix/src/builder/WebpackConfig.js:37:24)
    at async loadConfigByPath (<root>/node_modules/webpack-cli/lib/webpack-cli.js:1745:21)
    at async Promise.all (index 0)
    at async WebpackCLI.loadConfig (<root>/node_modules/webpack-cli/lib/webpack-cli.js:1763:29)
    at async WebpackCLI.createCompiler (<root>/node_modules/webpack-cli/lib/webpack-cli.js:2185:18) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '<root>/node_modules/vuetifyjs-mix-extension/index.js',
    '<root>/webpack.mix.js',
    '<root>/node_modules/laravel-mix/setup/webpack.config.js',
    '<root>/node_modules/webpack-cli/lib/webpack-cli.js',
    '<root>/node_modules/webpack-cli/lib/bootstrap.js',
    '<root>/node_modules/webpack-cli/bin/cli.js',
    '<root>/node_modules/webpack/bin/webpack.js'
  ]
}

What have I missed out?

martinbean avatar Jan 12 '22 20:01 martinbean