LaravelMix:ValidationError:CSSLoader已使用与API架构不匹配的选项对象进行初始化

我最近尝试运行npm run devnpm run watch,但在编译 80% 后出现错误。我尝试使用谷歌搜索它,但没有找到解决方案。下面是我在控制台中得到的错误。

./resources/sass/frontend/app.scss 中的错误模块构建失败(来自 ./node_modules/mini-css-extract-plugin/dist/loader.js):ModuleBuildError:模块构建失败(来自 ./node_modules/css- loader/dist/cjs.js): ValidationError: 无效的选项对象。CSS Loader 已使用与 AP I 架构不匹配的选项对象进行初始化。

  • options.url 应该是以下之一:boolean | 对象{过滤器?} -> 允许启用/禁用url()/image-set()功能处理。-> 在https://github.com/webpack-contrib/css-loader#url阅读更多
    详情:

    • options.url 应该是一个布尔值。
    • options.url 应该是一个对象: object { filter? 在验证 (E:Web Projectsprojectnode_moduleswebpacknode_modulesschema-utilsdistvalidate.js:105:11) 在 Object.getOptions (E:Web Projectsprojectnode_moduleswebpacklib NormalModule.js:527:19) 在 Object.loader (E:Web Projectsprojectnode_modulescss-loaderdistindex.js:31:27) 在 processResult (E:Web Projectsprojectnode_modules webpacklibNormalModule.js:701:19) 在 E:Web Projectsprojectnode_moduleswebpacklibNormalModule.js:807:5 在 E:Web Projectsprojectnode_modulesloader-runner libLoaderRunner.js:399:11 在 E:Web Projectsprojectnode_modulesloader-runnerlibLoaderRunner.js:251:18

webpack.mix.js

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

mix.setPublicPath('public')
    .setResourceRoot('../')
    .vue()
    .sass('resources/sass/frontend/app.scss', 'css/frontend.css')
    .sass('resources/sass/backend/app.scss', 'css/backend.css')
    .js('resources/js/frontend/app.js', 'js/frontend.js')
    .js([
        'resources/js/backend/before.js',
        'resources/js/backend/app.js',
        'resources/js/backend/after.js'
    ], 'js/backend.js')
    .js('resources/js/global.js', 'js/global.js')
    .js('resources/js/Banners/banner.js', 'js/banner.js')
    .extract([
        // Extract packages from node_modules to vendor.js
        'alpinejs',
        'jquery',
        'bootstrap',
        'popper.js',
        'axios',
        'sweetalert2',
        'lodash'
    ])
    .sourceMaps();

if (mix.inProduction()) {
    mix.version();
} else {
    // Uses inline source-maps on development
    mix.webpackConfig({
        loader: 'url-loader',
        devtool: 'inline-source-map'
    });
}

这两个Frontend.scssBackend.scss没有得到编译或混合,并抛出了上面给出的错误。当我试图评论它时,它按预期正常运行,但没有评论它,它没有。我不知道我哪里出错了。我也尝试运行npm rebuild node-sass,然后再次尝试运行npm run prod, npm run dev& npm run watch,但没有成功。

回答

作为解决方法,将 css-loader 包降级到 5.x 版本。

npm install css-loader@5.2.7 --save-dev


以上是LaravelMix:ValidationError:CSSLoader已使用与API架构不匹配的选项对象进行初始化的全部内容。
THE END
分享
二维码
< <上一篇
下一篇>>