Laravel 8中编译Sass触发sass-loader配置验证错误如何解决？

该报错由错误的Laravel Mix配置触发：sass()方法的第三个参数用于传递sass-loader的官方配置项，你传入了包含TailwindCSS插件的数组，不符合sass-loader的API Schema，webpack解析时将数组下标0识别为未知配置属性，因此抛出验证错误。

1. 修改webpack.mix.js配置 #

将TailwindCSS作为PostCSS插件放入全局options的postCss配置项中，修改后代码如下：

mix.js('resources/js/app.js', 'public/js')
    .sass('resources/scss/app.scss', 'public/css')
    .options({
        postCss: [
            require('tailwindcss'),
        ]
    });

2. 重新编译测试 #

如果修改配置后仍存在报错，可按以下步骤重置依赖后重试：

• 删除项目根目录下的node_modules文件夹、package-lock.json（npm环境）或yarn.lock（yarn环境）
• 运行npm install重新安装所有依赖
• 运行npm run dev重新测试前端资源编译

内容的提问来源于stack exchange，提问作者Swanito