vuetify-loader 1.6 与 laravel mix 不兼容，vue-loader 15 目前不支持带有 oneOf 的 vue 规则

Question

我正在尝试在 laravel 上安装 vue。我相信我明白了，但是当我运行 npm 运行 watch 或 npm 运行 dev 时，它会生成此错误。试了好几样都解决不了

Error: [VueLoaderPlugin Error] vue-loader 15 currently does not support vue rules with oneOf.
    at VueLoaderPlugin.apply (C:\laravel\construtora2\node_modules\vue-loader\lib\plugin-webpack4.js:46:13)
    at webpack (C:\laravel\construtora2\node_modules\webpack\lib\webpack.js:51:13)
    at processOptions (C:\laravel\construtora2\node_modules\webpack-cli\bin\cli.js:272:16)
    at C:\laravel\construtora2\node_modules\webpack-cli\bin\cli.js:364:3
    at Object.parse (C:\laravel\construtora2\node_modules\webpack-cli\node_modules\yargs\yargs.js:576:18)
    at C:\laravel\construtora2\node_modules\webpack-cli\bin\cli.js:49:8
    at Object.<anonymous> (C:\laravel\construtora2\node_modules\webpack-cli\bin\cli.js:366:3)
    at Module._compile (internal/modules/cjs/loader.js:1137:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1157:10)
    at Module.load (internal/modules/cjs/loader.js:985:32)
    at Function.Module._load (internal/modules/cjs/loader.js:878:14)
    at Module.require (internal/modules/cjs/loader.js:1025:19)
    at require (internal/modules/cjs/helpers.js:72:18)
    at Object.<anonymous> (C:\laravel\construtora2\node_modules\webpack\bin\webpack.js:156:2)
    at Module._compile (internal/modules/cjs/loader.js:1137:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1157:10)
    at Module.load (internal/modules/cjs/loader.js:985:32)
    at Function.Module._load (internal/modules/cjs/loader.js:878:14)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:71:12)
    at internal/main/run_main_module.js:17:47
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ development: `cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the @ development script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Gabriel\AppData\Roaming\npm-cache\_logs20-08-04T21_40_34_083Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ dev: `npm run development`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the @ dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Gabriel\AppData\Roaming\npm-cache\_logs20-08-04T21_40_34_137Z-debug.log

文件：webpack.mix.js

const mix = require('laravel-mix');

const VuetifyLoaderPlugin = require('vuetify-loader/lib/plugin');
var webpackConfig = {
        plugins: [
            new VuetifyLoaderPlugin()
            // other plugins ...
        ]
    // other webpack config ...
}
mix.webpackConfig(webpackConfig);
mix.js('resources/js/app.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css');

有人帮我吗

Answer 1

对，所以你正在使用 Vuetify 这是因为 vuetify-loader 1.6 在 laravel 混合设置方面存在一些问题。更具体地说，这是因为 vue-loader 和 vuetify-loader 的顺序是由 laravel-mix 添加的。

现在你需要在laravel-mix编译所有插件后添加VuetifyLoaderPlugin。

因此从 var webpackConfig 变量中删除 new VuetifyLoaderPlugin()。并在每个插件添加后添加new VuetifyLoaderPlugin()。

mix.extend('vuetify', new class {
    webpackConfig (config) {
        config.plugins.push(new VuetifyLoaderPlugin())
    }
})
mix.vuetify()

如果一切都让你难以抗拒，我有一个小 library 可以为你做所有事情。

您需要做的就是安装它

npm i vuetifyjs-mix-extension -D

需要它

require('vuetifyjs-mix-extension')

使用它

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

这两种方法应该为您做同样的事情。您可以根据自己的喜好选择。

Answer 2

尝试将 vuetify-loader 降级到旧版本

npm i vuetify-loader@1.5

Answer 3

对我有帮助。变化自

const VueLoaderPlugin = require('vue-loader');

至

const {VueLoaderPlugin} = require('vue-loader');

vuetify-loader 1.6 与 laravel mix 不兼容，vue-loader 15 目前不支持带有 oneOf 的 vue 规则

vuetify-loader 1.6 is incompatible with laravel mix, vue-loader 15 currently does not support vue rules with oneOf

laravel

laravel-mix

vuetify.js

laravel-vue

vuetify-loader