less - gulp-less 与全局变量混淆

Question

我正在尝试将版本字符串从 gulp 传递给 less，如以下示例项目所示：

包.json：

{
  "name": "webui",
  "version": "0.0.0",
  "private": true,
  "devDependencies": {
    "gulp": "^3.9.0",
    "gulp-less": "^3.0.5"
  }
}

gulpfile.js：

var gulp = require('gulp');
var less = require('gulp-less');

var LESS_PARAMS = {
  globalVars: {
    webUiVersion: '0.0.0'
  }
};

gulp.task('less', function() {
  return gulp.src('test.less')
    .pipe(less(LESS_PARAMS))
    .pipe(gulp.dest('.'))
})

无测试：

.test {
  background: url("test.jpg?v=@{webUiVersion}")
}

运行gulp less时，生成的test.css文件如下所示：

.test {
  background: url("test.jpg?v=0 0");
}

如您所见，gulp-less不知何故转变0.0.0为0 0. 如果我使用不带点的简单字符串，或者0，123asdf则替换工作正常。另外，直接调用

lessc --global-var='webUiVersion="0.0.0"' test.less

在命令行上产生所需的结果。

所以我的问题是：

这是故意行为还是错误？
有没有办法解决这个问题？

score 1 · Accepted Answer

我找到了解决此问题的方法：诀窍是将应该传递给 less 的字符串括在引号中，即 writewebUiVersion: '"0.0.0"'而不是webUiVersion: '0.0.0'in gulpfile.js。

其原因在下面的7 个阶段-max中已经指出：的值webUiVersion是直接传递给 less 的。没有引号，0.0.0被解析为两个数字，即0.0后面跟着.0，这会导致0 0生成的 CSS。

less - gulp-less 与全局变量混淆

1 回答 1

Related

Reference