Question

我在 .scss 文件中定义了我的 webpack.mix.js 文件。但是，每当我编译时，.css 文件都不会出现在我的公共目录中。我对文件的拼写和文件路径进行了三次检查，所以这不是问题。

这是我在部署到生产环境时遇到的错误：

File plus/public/css/build/partials/live/user-navigation-live.css not defined in asset manifest. (View: /usr/share/nginx/v-1-2021-05-11_10-38/resources/views/layouts/login.blade.php)

这就是它在 login.blade.php 中的定义

<link href="{{ Cdn::mix('plus/public/css/build/partials/live/user-navigation-live.css') }}" rel="stylesheet">

以下是它在 webpack.mix.js 文件中的定义：

mix.sass('resources/assets/sass/partials/live/user-navigation-live.scss', 'public/plus/public/css/build/partials/live/');

这是我的构建方式：

npm run dev && composer dump-autoload

此问题的原因可能是什么？

Answer 1

您的配置如何？

mix.webpackConfig({
    module: {
        rules: [
            {
                test:
                    /\.scss$/,
                use: [
                    {
                        loader: 'sass-loader',
                        options: {
                            // Prefer Dart Sass
                            implementation: require('sass'),

                            // See https://github.com/webpack-contrib/sass-loader/issues/804
                            webpackImporter: false,
                            sassOptions: {
                                includePaths: ['./node_modules', './vendor/']
                            },
                        }
                    },
                ]
            }
        ]
    },
});
if (mix.inProduction()) {
    mix.version();
}

您必须添加类似上面的配置才能使其工作。为什么不使用 asset() 助手加载文件？ mix() 仅在您有版本化文件时才有效。

为什么我的 .css 文件在构建 webpack.mix.js 时不会出现在 public 目录中？

1 个答案: