vuetifyjs-mix-extension
vuetifyjs-mix-extension copied to clipboard
Doesn’t work as per docs
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?