1

我正在使用 Gulp 分别连接/缩小 bower 文件夹(使用 main-bower-files)和 src 文件夹中的所有 JS/CSS 文件。我正在使用 gulp-load-plugins 从 package.json 加载以下依赖项(所有这些依赖项都存在于 node_modules 中):

"dependencies": {
    "gulp": "^3.9.1",
    "gulp-concat": "^2.6.0",
    "gulp-filter": "^4.0.0",
    "gulp-load-plugins": "^1.2.4",
    "gulp-rename": "^1.2.2",
    "gulp-uglify": "^1.5.3",
    "main-bower-files": "^2.13.1"
}

这是 gulpfile.js:

// Include Gulp
var gulp = require('gulp');

var src = 'src/';
var dest = 'public/';

// Include plugins
var plugins = require("gulp-load-plugins")({
    pattern: ['gulp-*', 'gulp.*', 'main-bower-files'],
    replaceString: /\bgulp[\-.]/
});

//Concat + Minify JS
gulp.task('js', function() {

var jsFiles = ['/src/js/*'];

gulp.src(plugins.mainBowerFiles().concat(jsFiles))
    .pipe(plugins.filter('*.js'))
    .pipe(plugins.concat('main.js'))
    .pipe(plugins.uglify())
    .pipe(gulp.dest('public/js'));

});
//Concat + Minify CSS
gulp.task('css', function() {

var cssFiles = ['src/css/*'];

gulp.src(plugins.mainBowerFiles().concat(cssFiles))
    .pipe(plugins.filter('*.css'))
    .pipe(plugins.concat('main.min.css'))
    .pipe(plugins.uglify())
    .pipe(gulp.dest(dest + 'css'));

});

// Default Task
gulp.task('default', ['js','css']);

Gulp 没有在控制台中提供任何错误,但没有创建 JS 和 CSS 文件。

4

2 回答 2

1

我遇到了完全相同的问题,结果发现“gulp-filter”由于这条线而无法正常工作:

.pipe(plugins.filter('*.js'))

它应该是以下内容:

.pipe(plugins.filter('**/*.js'))

CSS也应该发生同样的事情,它工作正常。

于 2017-04-09T13:43:54.147 回答
1

最终问题缩小到 gulp-filter 不返回任何文件。对于尝试进行类似设置的任何人,我最终通过使用 mainBowerFiles 过滤获得相同最终结果的文件采取了稍微替代的路径:

// Include Gulp
var gulp = require('gulp');

// Include plugins
var plugins = require("gulp-load-plugins")({
    pattern: ['gulp-*', 'gulp.*', 'main-bower-files'],
    replaceString: /\bgulp[\-.]/
});


var src = 'src/';
var dest = 'public/';


//Concat + Minify JS
gulp.task('test', function() {

console.log(plugins);

});


//Concat + Minify JS
gulp.task('js', function() {

var jsFiles = ['src/js/*'];

gulp.src(plugins.mainBowerFiles('**/*.js').concat(jsFiles))
    .pipe(plugins.concat('main.min.js'))
    .pipe(plugins.uglify())
    .pipe(gulp.dest(dest + 'js'));

});

gulp.task('css', function() {

    var cssFiles = ['src/css/*'];

    gulp.src(plugins.mainBowerFiles('**/*.css', {
        overrides: {
            bootstrap: {
                main: [
                    './dist/css/bootstrap.min.css'
                ]
            }
        }
    }).concat(cssFiles))
    .pipe(plugins.concat('main.min.css'))
    .pipe(plugins.cleanCss())
    .pipe(gulp.dest(dest + 'css'));

});


// Default Task
gulp.task('default', ['js','css']);
于 2016-06-28T06:44:52.417 回答