如何在 Angular 中获取文件哈希名称？

Question

在Angular 4我使用了Webpack的（甚至File-loader的） require 方法来获取图像哈希名称：

const versionedName = require('assets/images/icn-copy.svg');

它返回类似“ assets/images/icn-copy.435435fj5435f345345f435f435f345f.svg ”——散列文件名。 我可以用它来请求服务器。 但是在迁移到Angular 6 require 函数开始返回带有属性“ default ”的对象，该对象包含未经过哈希处理的名称。

如何在Angular 6及更高版本中获得散列名称？

更新：我注意到迁移后的图像现在根本没有散列。 这可能是原因。 例如

.loader {
    background-image: url('assets/images/spinner.svg');
...
}

结果在根中只是 spinner.svg 而不是spinner.214312fe21fe412f4ef.svg

更新 2 ：由于问题现在已经解决，我很高兴听到绕过图像缓存的更好方法。 require()绝对不是最好的方法。 这与资产中的图像无关。 这是关于请求的。 例如：

this.http.get('assets/images/spinner.svg') // will be cached
this.http.get('assets/images/spinner.214312fe21fe412f4ef.svg') // will NOT be cached.

Answer 1

问题是从Angular 6开始，默认情况下禁用散列。 添加标志--output-hashing=all解决了这个问题。 值得一提的是， Typescript 2.7现在允许默认导入到 CommonJS/AMD/UMD（ https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-7.html#support-for -import-d-from-cjs-from-commonjs-modules-with---esmoduleinterop ）。 这意味着require()现在返回的不是具有完整文件名的字符串，而是具有包含此string默认属性的object 。 代替

icn-copy.435435fj5435f345345f435f435f345f.svg

现在：

{
    default: "icn-copy.435435fj5435f345345f435f435f345f.svg"
}

但我仍然需要更好的解决方案！ （看更新2）