Question

我有一个可怕的时间使用yeoman / grunt和usemin - 当我有子文件夹时，试图让输出文件与在html中编写正确的路径同时工作。

我的基本设置是有顶级页面（例如index.html）以及子文件夹中的语言特定页面（en，de，fr等） - 每个页面都有常见的js文件（如jquery））还有语言特定的js文件（对于css也一样，但保持简单......）

– Gruntfile.js
– app
    |– index.html
    |– js
        jquery.js
            |– en
                english.js
            |– de
                german.js
    |– css
    |– en
        |– index.html
    |– de
        |– index.html
– dist

所以基本上 - 有顶级index.html有jquery等 - 所以那里的脚本标签可能看起来像

<script src="js/jquery.js"></script>

或使用rev

<script src="js/123.jquery.js"></script>

但是在en / index.html中，脚本标记看起来应该是这样的（对于常见的 - 像jquery）

<script src="../js/jquery.js"></script>

或与rev。

<script src="../js/123.jquery.js"></script>

这就是../这就是麻烦。

我可以创建js文件但不是rev'd，或者rev'd但是空，或者构建和rev'd但是在错误的位置（通常在app和dist文件夹之外/之上！）

在en / index.html中 - 我无法弄清楚构建：js应该是什么样子例如

<!-- build:js js/jquery.js -->
<script src="../js/jquery.js"></script>
<!-- endbuild -->

<!-- build:js js/en/english/jquery.js -->
<script src="../js/en/english.js"></script>
<!-- endbuild -->

我已经尝试了我能想到的每一个组合 - 似乎归结为如果我在build：js路径中写一个../，那么实际文件从app文件夹放置1级，但写道html中的路径正确。如果我离开../ out，它将文件放在正确的位置，但是html中没有../（它显然需要） - 所以我怎么说我想要输出文件到引用一级（从en /文件夹中），但是grunt 不将它放在一级（在dist文件夹外！）

谢谢！

Answer 1

我遇到了一个非常类似的问题。我使用他们的静态网站选项在S3上托管我的grunt生成的网站。在本地，usemin生成的内容工作正常（使用绝对路径），但由于我在S3上的存储桶中存在该站点，因此需要资源文件的完整绝对路径（带域）才能实际工作。

输入grunt-replace。使用搜索/替换模式是我发现实现这一目标的唯一方法。对我来说，我只需要替换＆＃34; / assets /＆＃34;用＆＃34; http://s3domain.com/bucket/site-name/assets/＆＃34;。这是我笨拙的任务定义：

replace: {
  dist: {
    options: {
      patterns: [
        {
          match: /\/assets\//,
          replacement: 'http://s3domain.com/bucket/site-name/assets/'
        }
      ]
    },
    files: [
      {
        expand: true,
        src: ['dist/**/*.html']
      }
    ]
  }
}

我已将其添加到我的deploy任务中，以便它只在我即将推送到S3之前运行。

对于您的情况，您可以让usemin执行其操作，然后只替换子目录中的文件（例如en或es）并将资产路径更改为{{1在他们之前。

Yeoman / Grunt usemin子文件夹

1 个答案: