Question

我正试图在我的Angular网站上解决一个问题，当我添加页面或进行更改时，由于缓存，它不会显示给用户。做了一些阅读后，我明白我想要做的就是创建一个指纹。

我环顾四周，似乎grunt-asset-fingerprint就可以了。我已下载该软件包并尝试运行它。但是，我有两个问题：

似乎只将一个文件复制到资产映射文件中（事实上它是我的bing授权文件），我原以为它会复制所有这些文件？
我不知道接下来要做什么，我是否需要将指纹添加到文件名中以避免缓存问题？我在网上找不到太多文件。

任何帮助将不胜感激！我的grunt配置的相关部分和assets.json文件的输出如下。谢谢！

＆＃13;

module.exports = function(grunt) {

  grunt.initConfig({

    pkg: grunt.file.readJSON('package.json'),
      
    assetFingerprint: {
      options: {
        algorithm: 'md5',
      },
      dist: {
        src: ["dist/**/*"],
        dest: "dist/"
      },
    }
      
  });

  grunt.loadNpmTasks('grunt-contrib-jshint');
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-contrib-cssmin');
  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-contrib-copy');
  grunt.loadNpmTasks('grunt-contrib-clean');  
  grunt.loadNpmTasks('grunt-processhtml');
  grunt.loadNpmTasks('grunt-contrib-imagemin');
  grunt.loadNpmTasks('grunt-contrib-htmlmin');    
  grunt.loadNpmTasks('grunt-newer');
  grunt.loadNpmTasks('grunt-asset-fingerprint');
};

＆＃13;

assets.json

＆＃13;

{
  "dist/": "./dist-dec2ce4621028dc1bd5g081ea11d1aff"
}

＆＃13;

Answer 1

请参阅grunt-rekai，这可以解决文件重命名问题并提供更多选项。

https://www.npmjs.com/package/grunt-rekai

Answer 2

我能够使用这种结构成功地将哈希附加到我的app.js文件中：

assetFingerprint: {
  "options": {
    "manifestPath": "dist/assets.json",
    "findAndReplaceFiles": [
        "index.html"
    ],
    "keepOriginalFiles": false
  },
  "dist": {
    "files": [
      {
        "expand": true,
        "cwd": "dist",
        "src": "app.js",
        "dest": "dist"
      }
    ]
  }
}

这也将更新我的index.html文件中对app.js的引用。您必须确保files块中使用的路径与目录结构一致。

如何使用Grunt-Asset-Fingerprint刷新缓存

2 个答案: