Gulp 翡翠汇编

Question

我正在使用 gulp-jade，但我的其中一个模板出现此错误：

557| 
558| 
> 559| 
560|     .tabs-wrap(ng-show="eventExists"): .contain-center
561| 
562|       #room-tabs-contain.contain-disable.contain: .contain-center

unexpected token "pipeless-text"
at Parser.parseExpr (/Users/dylan/project/node_modules/jade/lib/parser.js:254:15)

乍一看，这是 github.com/jadejs/jade 中的一个错误。可能是，但我也使用 jade 来通过 express 提供服务器模板，并且在通过 express 路由器时，模板完全符合要求，没有错误。

我试着明确说明 gulp 使用的 jade 实例：

gulpjade = require 'gulp-jade'
jade = require 'jade'
locals = {}
gulp.src "#{config.client}/**/*.jade"
  .pipe gulpjade(jade: jade, pretty: true, locals: locals)
  .pipe gulp.dest("#{config.build}")

仍然没有运气。我想弄清楚的关键问题是：

为什么这个jade模板通过express渲染的很好，但是在通过gulp-jade

Answer 1

原来，我错了。我实际上没有成功地使用 express 渲染模板。

我的模板遇到的正确解决方案和错误是由于 jade 1.9 和 1.11 之间的变化

示例 1

注释掉 .col-sm-3.text-right div

不好

//- .col-sm-3.text-right

很好

//-
  .col-sm-3.text-right

示例 2

img 元素应该可见，.col-sm-3.text-right div 应该被注释掉

不好

img(src="/image-path/png", alt="someimage")
  //- .col-sm-3.text-right

很好

img(src="/image-path/png", alt="someimage")
//- .col-sm-3.text-right

Gulp 翡翠汇编

Gulp jade compilation

javascript

node.js

express

gulp

pug

示例 1

不好

很好

示例 2

不好

很好