当我尝试使用gulp脚本构建我的应用程序时,我突然收到此错误,该脚本具有“图像”任务,该任务因此错误而失败:
node_modules \ vinyl index.js:153
if(!this.path)抛出新的错误('没有指定路径!无法获得相对。');
知道为什么会这样吗?我确实将这些文件移动到一个具有不同名称的新文件夹中,但我使用新文件夹名称更新了我的bower.json和package.json文件。
// Generated on 2016-03-15 using generator-angular 0.15.1
'use strict';
var gulp = require('gulp');
var $ = require('gulp-load-plugins')();
var openURL = require('open');
var lazypipe = require('lazypipe');
var rimraf = require('rimraf');
var wiredep = require('wiredep').stream;
var runSequence = require('run-sequence');
var config = {
bowerDir: './bower_components'
}
//app directory structor
var yeoman = {
app: require('./bower.json').appPath || 'app',
dist: 'dist',
temp: '.tmp',
test: 'test'
};
// for sources
var paths = {
scripts: [yeoman.app + '/scripts/**/*.js'],
styles: [yeoman.app + '/styles/**/*.scss'],
test: ['test/spec/**/*.js'],
testRequire: [
'bower_components/angular/angular.js',
'bower_components/angular-mocks/angular-mocks.js',
'bower_components/angular-resource/angular-resource.js',
'bower_components/angular-cookies/angular-cookies.js',
'bower_components/angular-sanitize/angular-sanitize.js',
'bower_components/angular-route/angular-route.js',
'bower_components/angular-animate/angular-animate.js',
'bower_components/angular-touch/angular-touch.js',
'bower_components/angular-ui-sortable/sortable.js',
'bower_components/angular-local-storage/dist/angular-local-storage.js',
'test/mock/**/*.js',
'test/spec/**/*.js'
],
karma: yeoman.test + '/karma.conf.js',
views: {
main: yeoman.app + '/index.html',
bowermain: yeoman.temp + '/index.html',
files: [yeoman.app + '/views/**/*.html']
}
};
////////////////////////
// Reusable pipelines //
////////////////////////
var lintScripts = lazypipe()
.pipe($.jshint) // '.jshintrc'
.pipe($.jshint.reporter, 'jshint-stylish');
var styles = lazypipe()
.pipe($.sass, {
outputStyle: 'expanded',
precision: 10
})
.pipe($.autoprefixer, {
browsers: ['last 2 version']
})
.pipe(gulp.dest, yeoman.temp + '/styles');
///////////
// Tasks //
///////////
gulp.task('styles', function () {
return gulp.src(paths.styles)
.pipe(styles());
});
gulp.task('lint:scripts', function () {
return gulp.src(paths.scripts)
.pipe(lintScripts());
});
gulp.task('clean:tmp', function (cb) {
rimraf(yeoman.temp, cb);
});
gulp.task('start:client', ['start:server', 'styles', 'lint:scripts'], function () {
openURL('http://localhost:9000');
});
gulp.task('start:server', function () {
$.connect.server({
root: [yeoman.temp, yeoman.app],
livereload: true,
port: 9000,
middleware: function (connect, opt) {
return [['/bower_components',
connect["static"]('./bower_components')]]
}
});
});
gulp.task('start:server:test', function () {
$.connect.server({
root: [yeoman.test, yeoman.app, yeoman.temp],
livereload: true,
port: 9001,
middleware: function (connect, opt) {
return [['/bower_components', connect["static"]('./bower_components')]
]
}
});
});
gulp.task('watch', function () {
$.watch(paths.styles)
.pipe($.plumber())
.pipe(styles())
.pipe($.connect.reload())
$.watch(paths.views.files)
.pipe($.plumber())
.pipe($.connect.reload())
$.watch(paths.scripts)
.pipe($.plumber())
.pipe(lintScripts())
$.watch(paths.test)
.pipe($.plumber())
gulp.watch('bower.json', ['bower']);
});
gulp.task('serve', function (cb) {
runSequence('clean:tmp',
['bower'],
['lint:scripts'],
['start:client'],
'watch', cb);
});
gulp.task('serve:prod', function () {
$.connect.server({
root: [yeoman.dist],
livereload: {
port: 810
},
port: 800,
middleware: function (connect, opt) {
return [['/bower_components', connect["static"]('./bower_components')]
]
}
});
});
gulp.task('test', ['start:server:test'], function () {
var testToFiles = paths.testRequire.concat(paths.scripts, paths.test);
return gulp.src(testToFiles)
.pipe($.karma({
configFile: paths.karma,
action: 'watch'
}));
});
// inject bower components
gulp.task('bower', function () {
return gulp.src(paths.views.main)
.pipe(wiredep({
directory: /*yeoman.app +*/ 'bower_components',
ignorePath: '..'
}))
.pipe(gulp.dest(yeoman.temp));
});
///////////
// Build //
///////////
gulp.task('clean:dist', function (cb) {
rimraf(yeoman.dist, cb);
});
gulp.task('client:build', ['bower', 'html', 'styles'], function () {
var jsFilter = $.filter('**/*.js');
var cssFilter = $.filter('**/*.css');
return gulp.src(paths.views.bowermain)
.pipe($.useref({ searchPath: [yeoman.app, yeoman.temp] }))
.pipe(jsFilter)
.pipe($.ngAnnotate())
.pipe($.uglify())
.pipe(jsFilter.restore())
.pipe(cssFilter)
.pipe($.minifyCss({ cache: true }))
.pipe(cssFilter.restore())
.pipe(gulp.dest(yeoman.dist));
});
gulp.task('html', function () {
return gulp.src(yeoman.app + '/views/**/*')
.pipe(gulp.dest(yeoman.dist + '/views'));
});
gulp.task('copy:data', function () {
return gulp.src(yeoman.app + '/data/**/*')
.pipe(gulp.dest(yeoman.dist + '/data'));
});
gulp.task('copy:svg', function () {
return gulp.src(yeoman.app + '/svg/**/*')
.pipe(gulp.dest(yeoman.dist + '/svg'));
});
gulp.task('images', function () {
return gulp.src(yeoman.app + '/images/**/*')
.pipe($.cache($.imagemin({
optimizationLevel: 5,
progressive: true,
interlaced: true
})))
.pipe(gulp.dest(yeoman.dist + '/images'));
});
gulp.task('copy:extras', function () {
return gulp.src(yeoman.app + '/*/.*', { dot: true })
.pipe(gulp.dest(yeoman.dist));
});
gulp.task('copy:fonts', function () {
return gulp.src('./bower_components/bootstrap/dist/fonts/**/*')
.pipe(gulp.dest(yeoman.dist + '/fonts'));
});
gulp.task('copy:icons', function() {
return gulp.src('./bower_components/font-awesome/fonts/**.*')
.pipe(gulp.dest(yeoman.dist + '/fonts'));
});
gulp.task('copy:favicon', function () {
return gulp.src(yeoman.app + '/favicon.ico')
.pipe(gulp.dest(yeoman.dist));
});
gulp.task('build', ['clean:dist', 'bower'], function () {
runSequence(['images', 'copy:data', 'copy:extras', 'copy:fonts','copy:icons', 'copy:svg', 'copy:favicon', 'client:build']);
});
gulp.task('default', ['build']);
我禁用缓存,它工作。如果你正在使用gulp改变这个:
gulp.src('app/images/**/*')
.pipe($.cache($.imagemin({
// some options here
})))
至:
gulp.src('app/images/**/*')
.pipe($.imagemin({
// some options here
}))
好吧,经过大量的头发拔出并在我的显示器上发誓,我终于弄明白了问题是什么,希望它能帮助别人。
这些图像最初都是在我的原型项目的git存储库中,我使用visual studio复制这些图像作为我的新项目的现有添加。我不知道为什么,但是如果你在paint.net中打开那些图像并将它们保存在具有完全相同名称和扩展名的完全相同的文件夹中,它们将被标记为由git更改,然后如果你运行你的gulp图像任务你赢了如上所示,不会出现乙烯基错误。
绝对是一个令人头疼的问题......
我在工作中使用的gulp脚本打开和关闭此问题。 haakon.io的答案对我有用。
有缓存的东西导致vinyl.fs跳过我的images文件夹中的某些文件。由于具有此脚本的站点具有大量图像资源,因此我在桌面上创建了一个图像文件夹,并抓取所有图像的一半并将其拖出文件夹并运行gulp images
任务。我慢慢添加资源,直到我找到绊倒乙烯基的文件。一旦我这样做,在Photoshop中重新保存它可以解决问题。在可以更新脚本之前,该解决方法效果最佳。当你有很多可能导致这种情况的图像时;这是我发现调试的最简单方法。