我目前正在尝试从svg子画面中删除未使用的SVG。为此,我遇到了purge-svg一个软件包,该软件包将从SVG子画面中删除未使用的SVG。我正在尝试同步运行两个任务。第一个是编译并创建第二个任务所需的SVG精神。
第二个任务获取在第一个任务中创建的SVG精灵,并删除未使用的SVG。这是任务。
/**
* SVGs
*/
gulp.task('svgs', (done) => {
gulp.src(`${PATTERNS_ACCESS}/dist/svg/*.svg`)
.pipe(svgmin())
.pipe(svgstore({
inlineSvg: true
}))
.pipe(rename('icons.svg'))
.pipe(gulp.dest('assets/svg/'))
.pipe(hashFilename({format: HASH_FORMAT}))
.pipe(gulp.dest('assets/svg/'));
done();
});
gulp.task('purge-svgs', (done) => {
new PurgeSvg({
content: [
'./views/**/*.twig',
'./views/**/*.vue'
],
svgs: [
'./assets/svg/icons.svg',
'./assets/svg/icons.*.svg',
]
}).purge();
done();
});
gulp.task('build-svgs', gulp.series('svgs', 'purge-svgs'));
似乎认为第二个任务purge-svgs
无法正确加载在第一个任务svgs
上编译的文件。基本上,我使用以下提到how to run the tasks in series.
当我运行gulp build-svgs
时,我得到的是已清除的文件,但为空,好像没有在任务1上编译文件:
似乎正在发生错误,因为假定要在任务一中编译的文件未完成编译或未正确加载。
当我登录symbols
时,我可以看到所有图标,并且它们并非未定义:
{ _attributes: { id: 'icon-ui-search', viewBox: '0 0 24 24' },
circle: { _attributes: [Object] },
path: { _attributes: [Object] } },
{ _attributes: { id: 'icon-ui-send', viewBox: '0 0 24 24' },
path: { _attributes: [Object] } },
{ _attributes: { id: 'icon-ui-settings', viewBox: '0 0 24 24' },
circle: { _attributes: [Object] },
path: { _attributes: [Object] } },
{ _attributes: { id: 'icon-ui-share-2', viewBox: '0 0 24 24' },
circle: [ [Object], [Object], [Object] ],
path: { _attributes: [Object] } },
{ _attributes: { id: 'icon-ui-share', viewBox: '0 0 24 24' },
path: { _attributes: [Object] } },
{ _attributes: { id: 'icon-ui-thumbs-down', viewBox: '0 0 24 24' },
path: { _attributes: [Object] } },
{ _attributes: { id: 'icon-ui-thumbs-up', viewBox: '0 0 24 24' },
path: { _attributes: [Object] } },
{ _attributes: { id: 'icon-ui-translate', viewBox: '0 0 24 24' },
path: { _attributes: [Object] } },
{ _attributes: { id: 'icon-ui-twitter', viewBox: '0 0 24 24' },
path: { _attributes: [Object] } },
{ _attributes: { id: 'icon-ui-user-check', viewBox: '0 0 24 24' },
path: [ [Object], [Object] ],
circle: { _attributes: [Object] } },
{ _attributes: { id: 'icon-ui-x-circle', viewBox: '0 0 24 24' },
circle: { _attributes: [Object] },
path: { _attributes: [Object] } },
{ _attributes: { id: 'icon-ui-x', viewBox: '0 0 24 24' },
path: { _attributes: [Object] } },
{ _attributes: { id: 'icon-urgent', viewBox: '0 0 32 32' },
path: { _attributes: [Object] } },
{ _attributes: { id: 'icon-warning', viewBox: '0 0 32 30' },
path: { _attributes: [Object] } },
{ _attributes: { id: 'icon-work-v2', viewBox: '0 0 48 48' },
ellipse: { _attributes: [Object] },
circle: { _attributes: [Object] },
path: [ [Object], [Object] ] },
{ _attributes: { id: 'icon-work', viewBox: '0 0 20 21' },
g: { _attributes: [Object], g: [Array] } },
{ _attributes: { id: 'icons' } } ]
这是同步运行gulp任务的正确方法吗?