2

我想使用 mix.sass 和 PostCss 关键 CSS 拆分来设置 Laravel Mix。最后我想要两个文件：app.css 和 app-critical.css。

不幸的是，我可以让它工作。我尝试过的设置之一（webpack.mix.js）：

    混合
        .js('templates/src/js/app.js', 'web/assets/dist/')
        .js('templates/src/js/home.js', 'web/assets/dist/')
        .extract(['vue','axios','lazysizes','svgxuse','fontfaceobserver'],'web/assets/dist/vendor.js')
        .sass('模板/src/scss/app.scss', 'web/assets/dist/')
        .sourceMaps()
        。选项（{
            帖子：[
                要求（'postcss-critical-css'）（{
                    保留：假，
                    缩小：假
                })
            ]
        })
        .browserSync({
            代理：'127.0.0.1:8080',
            文件：[
            '模板/**/*.twig',
            '模板/src/js/**/*',
            '模板/src/scss/**/*'
        ]
    });

    如果（mix.inProduction（））{
        console.log("生产中");
        混合版本（）；
    }

当我通过“npm run watch”运行脚本时，出现错误：

10% 构建模块 0/1 模块 1 个活动 ...ign-tools/templates/src/scss/app.scssWithout `from` 选项 PostCSS 可能会生成错误的源映射并且不会找到 Browserslist 配置。将其设置为 CSS 文件路径或“未定义”以防止出现此警告。

此外，我的文件只是复制了所有关键样式。文件越来越大，每次输入 SCSS/CSS 文件更改时都会扩展重复的代码。

我确实尝试设置 Laravel Mix + mix.sass + 以下插件之一：

没有成功:(有人有工作设置或链接到示例存储库吗？

谢谢，滕

4

0 回答 0