grunt usemin没有用revved文件行替换参考块

Question

我在grunt usemin中遇到了一个问题，它没有用单个旋转的行替换非旋转的参考块。参考块中的两个文件被连接并放大得很好；单个文件metadata.min.js也得到了很好的版本控制；但是，revved文件中对的引用并没有插入到index.html中。只有非revved行。

我正在使用：

• grunt usemin 2.6.0
• 咕哝文件2.1.1版
• 用于模板化的Zend框架（因此产生了奇怪的模板路径）

这是运行grunt build:之前的index.html参考块

<!-- build:js js/dest/metadata.min.js -->
<script src="js/metadata/MetadataController.js"></script>
<script src="js/metadata/MetadataService.js"></script>
<!-- endbuild -->

以下是相关的Grunt配置：

useminPrepare: {
  html: '../cdm_common/cdm/layouts/scripts/index.html',
  options: {
    dest: 'dist',
    root: '.'
  }
},
filerev: {
  options: {
    encoding: 'utf8',
    algorithm: 'md5',
    length: 8
  },
  js: {
    src: ['dist/js/dest/*.js'],
    dest: 'js/dest/rev/test'
  }
},
usemin: {
  html: '../cdm_common/cdm/layouts/scripts/index.html',
  options: {
    assetsDirs: ['js/dest/rev/test']
  }
},
grunt.registerTask('build' ['useminPrepare','concat:generated','uglify:generated','filerev','usemin']);

这是运行grunt build:之后的index.html

<script src="js/dest/metadata.min.js"></script>

有什么理由让加速线看起来不应该是这样的吗？

<script src="js/dest/metadata.min.a5851d60.js"></script>

这是一只会发出咕噜声的虫子吗？某个地方有配置吗？虽然没有真正回答，但这类似于：Usemin不替换HTML 中的引用块

我的头撞在桌子上有一段时间了。任何见解都将不胜感激。

Answer 1

请尝试使用以下usemin配置运行grunt --debug以获取更多信息：

usemin: {
  html: '../cdm_common/cdm/layouts/scripts/index.html',
  options: {
    assetsDirs: ['js/dest/rev/test'],
    blockReplacements: {
        js: function (block) {
            grunt.log.debug(JSON.stringify(block.dest));
            grunt.log.debug(JSON.stringify(grunt.filerev.summary));
            return '<script src="'+block.dest+'"></script>';
        }
    }
  }
}

这将回显其生成的当前块和具有filerev修改的文件的对象。

在我的情况下，我有一个额外的"public/"文件夹，所以我的字符串与对象中的密钥不匹配，因此usemin无法找到filerev:创建的新位置

[D] "js/build/vendors.js"
[D] "public\js\build\vendors.js": "public\js\build\vendors.4e02ac3d2e56a0666608.js", "public\js\build\main.js": "public\js\build\main.acd1b38e56d54a170d6d.js"}

最终，我用这个自定义的blockReplacements函数（即替换公共/和讨厌的Windows路径）解决了这个问题：

js: function (block) {
    var arr = {};
    for (var key in grunt.filerev.summary) {
        arr[key.replace(/\/g, "/").replace(////g, "/").replace("public/", "")] = grunt.filerev.summary[key].replace(/\/g, "/");
    }
    var path = (arr[block.dest] !== undefined) ? arr[block.dest] : block.dest;
    return '<script src="{{ asset(''+Twig.basePath + path +'') }}"></script>';
},

Answer 2

我也遇到了这种情况，问题是由于usemin块中没有正确的assetDirs引起的。您需要确保您的assetDirs数组包含已更新文件的父文件夹。

资产目录文件

这是一个目录列表，我们应该在其中开始查找当前查看的文件中引用的资产的更新版本。

usemin: {
    html: 'build/index.html',
    options: {
        assetsDirs: ['foo/bar', 'bar']
    }
}

假设在index.html中有一个对/images/foo.png的引用，usemin将在assetsDirs选项中的任何目录中搜索/images/foo.png的修订版本，比如/images/soo.12345678.png。

换句话说，给定上面的配置，usemin将搜索其中一个文件的存在：

foo/bar/images/foo.12345678.png

bar/images/foo.12345678.png

@Billy Blaze应该能够通过将usemin块中的assertDirs更新为assetsDirs: ['js/dest/rev/test', 'public'] 来替换他的自定义块Replacements函数

Answer 3

除了Micah所说的获取正确的assetsDirs路径之外，您还可以设置DEBUG变量来实际查看正在为文件搜索哪些路径。

如果你的构建任务是"构建"，那么你会输入这个：

DEBUG=usemin:*，revvedfinder咕哝着构建

这将有助于准确地追踪您在assetsdir中需要的路径。