2

（免责声明：我是一名 UX 设计师，这是我的第一个“自制”makefile）

我想在我的 makefile 中添加一行来获取我的 src/jade 目录的内容并将其作为 html 在 public/ 中输出。我的makefile位于包含src和public的项目目录中的两个目录之上。所以我想要的是：

src/jade
  |--Enterprise/index.jade
  |--SmallBusines/index.jade
  |--Public Sector/index.jade

并得到

public
  |--Enterprise/index.jade
  |--SmallBusines/index.jade
  |--Public Sector/index.jade

我想不通的是如何让它爬取 src/jade 中的子目录。这是我所拥有的：

jade -P -p . -o public src/jade/

这只需要 src/jade 中的东西，但没有子目录。我已经进行了相当多的实验和谷歌搜索，但没有什么能做到这一点。

编辑：这是我的实际生成文件

all: 
  mkdir -p public
  make jade
  make coffee
  make less
  make statics

jade: 
  jade -P -p . -o public src/jade/

coffee: 
  coffee --compile --output public/js src/coffee

less: 
  lessc --strict-imports src/less/styles.less public/css/styles.css

statics:
  cp -a src/less/img public/css/
  cp -a src/font public/
  cp -a src/coffee/bootstrap.min.js public/js/

clean:
  rm -rf public

另外 - 一旦我弄清楚了，我也需要排除目录，因为 src/jade 将包含 /includes 和 /blocks 之类的东西，它们会被导入到站点的实际“页面”中，而不是页面本身。

我已经完成了jade --help，其中没有关于子目录和排除项以及人工制作的内容。还有其他地方我可以看吗，或者以前有没有人遇到过？

4

2 回答 2

1

我对玉一无所知，但如果它需要一个.jade文件并生成一个.html文件，那么你可能想要这样的东西：

JADE := jade
JADEFLAGS := -P -p .
SRCDIR := src/jade
HTMLDIR := public

JADEFILES := $(shell find $(SRCDIR) -type f -name \*.jade)
HTMLFILES := $(patsubst $(SRCDIR)/%,$(HTMLDIR)/%,$(JADEFILES))

.PHONY: all
all: $(HTMLFILES)

$(HTMLDIR)/%.html : $(SRCDIR)/%.jade
        $(JADE) $(JADEFLAGS) -o $(HTMLDIR) $<

如果您按照以前的方式进行操作，那么每次运行 make 时都会创建所有输出文件，无论发生了什么变化。如果这就是你想要做的，那么使用 make 只是无用的复杂化。Make 用于根据文件更改的时间避免不必要的重建；如果您想在运行命令时始终重建所有内容，只需编写一个 shell 脚本，而不是 makefile。

预计到达时间：

如果你真的只想要最简单的版本，试试这个（同样，我从来没有使用过玉，所以我不确定它是如何工作的，但如果它需要一个玉文件列表，这应该可以工作）：

# Use the UNIX find(1) command to locate all the jade files under src/jade
jade:
        jade -P -p . -o public `find src/jade -name \*.jade`

预计到达时间：

看来您的示例输出是错误的：它表明翡翠会生成类似 的文件foo.jade，但这是不对的：翡翠似乎会生成类似foo.html. 如果玉本身不维护目录结构，那么您将需要更接近我最初建议的东西。我将尝试简化一下：

SRCDIR := src/jade
HTMLDIR := public

# Find all the .jade files, using UNIX find(1)
JADEFILES := $(shell find $(SRCDIR) -type f -name \*.jade)

# Convert all the .jade files to .html in the output directory
HTMLFILES := $(patsubst $(SRCDIR)/%.jade,$(HTMLDIR)/%.html,$(JADEFILES))

# A target that depends on all the .html files we will generate
.PHONY: jade
jade: $(HTMLFILES)

# A pattern rule that shows how to build a single .jade file
# into a single .html file
$(HTMLDIR)/%.html : $(SRCDIR)/%.jade
        jade -P -p . -o $(@D) $<

要了解模式规则，您应该阅读 GNU make 手册中关于“自动变量”的部分，但基本上$<代表第一个先决条件（在这种情况下是 .jade 文件）并且$@是目标文件（在这种情况下是 .html 文件）。变量$(@D)是目标文件的目录。

于 2013-07-29T16:52:21.310 回答
1

由于我在许多项目中使用 Jade 和 Node，我制作了一个简单（虽然不是那么聪明）的脚本，它可以爬取 Jade 文件夹并将结构输出到目标文件夹。由于我在几个项目中使用了它，因此我通过 CLI 输入了源文件夹和目标文件夹。咖啡脚本代码如下：

fs = require 'fs'
path = require 'path'
exec = require('child_process').exec

# Get base from cli
jadePath = process.argv[2]
base = process.argv[3]

_build = (dir) ->
  files = fs.readdirSync dir
  for f in files

    if f == path.basename __filename
      continue

    fullPath = path.join(dir, f)
    stat = fs.statSync fullPath

    if stat.isDirectory()
      try
        fs.mkdirSync path.join(base, fullPath)
      _build fullPath
    else if path.extname(f) == '.jade'
      # Compile jade
      dirName = path.join base, (path.dirname fullPath)
      dirName = dirName.replace jadePath, ''
      dirName = dirName.replace '//', '/'
      console.log "Compiling jade file '#{fullPath}' to directory #{dirName}"
      exec('jade -o ' + dirName + ' ' + fullPath)

# Start process with path from cli
_build jadePath

作为旁注，通常直接使用 npm 构建/自动化我的项目，scripts通过packages.json. 例如：

"scripts": {
    "build:js": "coffee -cb -o www/js/ www/_src/coffee/",
    "build:html": "coffee run_jade.coffee www/_src/jade/ www/templates/",
    "build:css": "sass www/_src/sass/style.scss www/css/style.css",
    "build": "npm run build:js && npm run build:html && npm run build:css",
    "watch": "watch 'npm run build' www/_src/",
    "test": "karma start test/karma.conf.coffee"
  }

然后如果我想构建我的 html，我可以简单地npm run build:html. 希望这可以帮助 ：）

于 2015-02-10T17:47:25.220 回答