基于env _

Question

我想要基于env $fa_font_path更改SCSS变量APP_DIR吗？

我有一个网站，在localhost/演示服务器上，它在子文件夹上，在活动服务器上，它位于主文件夹上，我在.env上添加了.env上的.env来显示子文件夹APP_DIR=/subfoulder/，在活动服务器上它是APP_DIR=/。

我找到了这个答案，但没有用

const mix = require("laravel-mix");
    
var fa_font_path =
    process.env.APP_DIR + "fonts/fontawesome-free/webfonts";
    mix.js("resources/js/app.js", "public/js")
    .sass("resources/sass/app.scss", "public/css", {
        data: "$fa-font-path:'" + fa_font_path + "';"
    })      
    .setResourceRoot(process.env.APP_DIR)
    .sourceMaps();

此部分生成一个错误。

, {
            data: "$fa-font-path:'" + fa_font_path + "';"
  }

错误：

ERROR in ./resources/sass/app.scss
Module build failed (from ./node_modules/css-loader/index.js):
ModuleBuildError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
ValidationError: Invalid options object. Sass Loader has been initialized using an options object that does not match the API schema.

注意:这不是一个重复的问题，我已经搜索并阅读了其他答案。

Answer 1

laravel 8更新

data属性更改为prependData

在laravel 8上，要传递sass文件上的数据，您需要在类似的对象上添加sass代码字符串：

{
prependData: "$fa-font-path:'" + fa_font_path + "';"
}

webpack.mix.js

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


var fa_font_path =
    process.env.APP_DIR + "fonts/vendor/@fortawesome/fontawesome-free/webfonts";


mix.js("resources/js/app.js", "public/js")
    .sass("resources/sass/app.scss", "public/css", {
        prependData: "$fa-font-path:'" + fa_font_path + "';"
    })
    .setResourceRoot(process.env.APP_DIR)
    .sourceMaps()
    .version();