Question

我希望基于环境变量在LESS中有一个变量：

@asset-path: process.env.IN_SHELL ? '/path/1/' : '/path/2/'

由于我的资产路径不同，具体取决于加载应用的上下文。

我使用webpack（v4）与最新的less-loader，样式加载器和postcss-loader（供应商前缀）。感谢。

Answer 1

您无法在LESS中使用javascript功能。逻辑需要在您的webpack配置中我想我会使用string-replace-loader作为LESS文件的第一个加载器，并替换正确路径的占位符。

这样的事情：

{
    test: /\.less$/,
    use: [
        'style-loader',
        'postcss-loader',
        'less-loader',
        {
            loader: 'string-replace-loader',
            options: {
                search: 'PATH-PLACEHOLDER',
                replace: process.env.IN_SHELL ? '/path/1/' : '/path/2/',
            },
        },
    ],
},

Answer 2

您可以在LessLoader中使用ModifyVars功能

modifyVars : { 'asset-path': process.env.IN_SHELL ? '/path/1/' : '/path/2/'}

传递环境变量的LESS变量

2 个答案: