Question

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

的package.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.less：

.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

命令行上的

会产生所需的结果。

所以我的问题是：

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

Answer 1

我找到了解决此问题的方法：诀窍是将应该传递给较少引号的字符串括起来，即在{{webUiVersion: '"0.0.0"'而不是webUiVersion: '0.0.0'中写gulpfile.js 1}}。

下面的seven-phases-max指出了这一点的原因：webUiVersion的值直接传递给less。如果没有引号，0.0.0将被解析为两个数字，即0.0后跟.0，这会在生成的CSS中生成0 0。

没有吞噬全局变量的混乱

1 个答案: