如何使用 rev-replace 替换我的 manifest.json 文件中的文件名
How to replace Filenames inside my manifest.json File using rev-replace
我有点卡住了 - 我想用清单文件中的哈希版本替换图像文件名。
清单看起来像这样:
{
"icons": [
{
"src": "android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "android-chrome-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
]
}
我希望将这些图标 src 替换为散列文件名,如下所示:"android-chrome-192x192-b03df0131.png"
我的 gulp 文件应该是这样的:
const gutil = require('gulp-util');
module.exports = function (gulp, plugins) {
return function () {
const manifest = gulp.src('public/dist/rev-manifest.json');
return gulp.src(['public/dist/@(css|js)/**','public/dist/img/icon/**.json'])
.pipe(plugins.revReplace({replaceInExtentions: ['.json']}))
.pipe(plugins.revReplace({manifest: manifest}))
.pipe(gulp.dest('public/dist'));
};
};
经过大量谷歌搜索和文档阅读后,我开始工作了:D
所以如果有人搜索这个:
const gutil = require('gulp-util');
module.exports = function (gulp, plugins) {
return function () {
const manifest = gulp.src('public/dist/rev-manifest.json');
function replaceIconPath(filename) {
if(filename.includes('android-chrome-')) {
return filename.replace('img/icon/', '');
}
return filename;
}
return gulp.src('public/dist/@(css|js|img)/**')
.pipe(plugins.revReplace({
replaceInExtensions: ['.json', '.css', '.js', '.html', '.hbs'],
manifest: manifest,
modifyUnreved: replaceIconPath,
modifyReved: replaceIconPath
}))
.pipe(gulp.dest('public/dist'));
};
};
让我简单解释一下 - 重要部分在 plugins.revReplace。
您需要选项 replaceInExtension 并添加“.json”,但您还需要指定默认选项,否则它们将会丢失。
如果您必须进一步修改文件名,则只需要 'modifiyUnreved' 和 'modifyReved' 选项。在我的例子中,它找不到文件,因为我的 rev-manifest 与我的清单文件相比处于另一个级别。所以我需要切断它的路径以找到 src 并替换它。
我有点卡住了 - 我想用清单文件中的哈希版本替换图像文件名。
清单看起来像这样:
{
"icons": [
{
"src": "android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "android-chrome-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
]
}
我希望将这些图标 src 替换为散列文件名,如下所示:"android-chrome-192x192-b03df0131.png"
我的 gulp 文件应该是这样的:
const gutil = require('gulp-util');
module.exports = function (gulp, plugins) {
return function () {
const manifest = gulp.src('public/dist/rev-manifest.json');
return gulp.src(['public/dist/@(css|js)/**','public/dist/img/icon/**.json'])
.pipe(plugins.revReplace({replaceInExtentions: ['.json']}))
.pipe(plugins.revReplace({manifest: manifest}))
.pipe(gulp.dest('public/dist'));
};
};
经过大量谷歌搜索和文档阅读后,我开始工作了:D
所以如果有人搜索这个:
const gutil = require('gulp-util');
module.exports = function (gulp, plugins) {
return function () {
const manifest = gulp.src('public/dist/rev-manifest.json');
function replaceIconPath(filename) {
if(filename.includes('android-chrome-')) {
return filename.replace('img/icon/', '');
}
return filename;
}
return gulp.src('public/dist/@(css|js|img)/**')
.pipe(plugins.revReplace({
replaceInExtensions: ['.json', '.css', '.js', '.html', '.hbs'],
manifest: manifest,
modifyUnreved: replaceIconPath,
modifyReved: replaceIconPath
}))
.pipe(gulp.dest('public/dist'));
};
};
让我简单解释一下 - 重要部分在 plugins.revReplace。
您需要选项 replaceInExtension 并添加“.json”,但您还需要指定默认选项,否则它们将会丢失。
如果您必须进一步修改文件名,则只需要 'modifiyUnreved' 和 'modifyReved' 选项。在我的例子中,它找不到文件,因为我的 rev-manifest 与我的清单文件相比处于另一个级别。所以我需要切断它的路径以找到 src 并替换它。