gulp-usemin TypeError:Path必须是一个字符串。收到undefined

时间:2016-01-22 14:26:32

标签: javascript angularjs-directive gulp gulp-uglify gulp-usemin

我正在使用gulp-usemin来缩小我在我的应用中使用的javascript文件,因为某些原因gulp没有看到我的一个文件。我在index.html中有这个:

<body ng-app="App">
    <!--[if lte IE 8]>
      <p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
    <![endif]-->

    <div>
        <ui-view></ui-view>
    </div>

    <div class="footer">
        <div class="container">
            <!-- TODO: add fotter here -->
        </div>
    </div>

    <!-- build:js(.) scripts/scripts.js-->
    <script src="bower_components/jquery/dist/jquery.min.js" type="text/javascript"></script>
    <script src="bower_components/bootstrap/dist/js/bootstrap.min.js" type="text/javascript"></script>
    <script src="bower_components/angular/angular.min.js" type="text/javascript"></script>
    <script src="bower_components/angular-ui-router/release/angular-ui-router.min.js" type="text/javascript"></script>
    <script src="bower_components/angular-bootstrap/ui-bootstrap-tpls-0.14.3.min.js" type="text/javascript"></script>
    <!-- endbuild -->

    <!-- build:js({.tmp,app}) -->
    <script src="scripts/app.js"></script>
    <script src="scripts/routes.js" type="text/javascript"></script>
    <script src="scripts/controllers/controller1.js" type="text/javascript"></script>        
    <script src="scripts/controllers/controller2.js" type="text/javascript"></script>
    <script src="scripts/services/service1.js" type="text/javascript"></script>
    <script src="scripts/services/service2.js" type="text/javascript"></script>
    <script src="scripts/directives/directive1/directive1.js" type="text/javascript"></script>
    <script src="scripts/directives/directive2/directive2.js" type="text/javascript"></script>
    <!-- endbuild -->
</body>

这是我的gulpfile.js:

// Generated on 2015-12-16 using generator-angular 0.15.1
'use strict';

var gulp = require('gulp'),
    usemin = require('gulp-usemin'),
    wrap = require('gulp-wrap'),
    connect = require('gulp-connect'),
    watch = require('gulp-watch'),
    minifyCss = require('gulp-minify-css'),
    minifyJs = require('gulp-uglify'),
    concat = require('gulp-concat'),
    less = require('gulp-less'),
    rename = require('gulp-rename'),
    minifyHTML = require('gulp-minify-html'),
    zip = require('gulp-zip');

var paths = {
    scripts: 'app/scripts/**/*.*',
    styles: 'app/styles/**/*.less',
    custom_css: 'app/styles/**/*.css',
    custom_fonts: 'fonts/**/*.{ttf,woff,eof,svg}',
    images: 'app/images/**/*.*',
    templates: 'app/views/**/*.html',
    index: 'app/index.html',
    bower_fonts: 'bower_components/**/*.{ttf,woff,eof,svg}',
    customstyle:'bower_components/bootstrap/dist/css/bootstrap.min.css'
};

var logerror = function(e){ console.log(e); };

/**
 * Handle bower components from index
 */
gulp.task('usemin', function() {
    return gulp.src(paths.index)
        .pipe(usemin({
            js: [minifyJs().on('error', function(e){ console.log(e); }),         'concat'],
            css: [minifyCss({keepSpecialComments: 0}), 'concat']
        }))
        .pipe(gulp.dest('dist/'));
});

gulp.task('zip', function () {
    return gulp.src(['dist/**/*.*', '!dist/dist.zip', '!dist/index.html'])
        .pipe(zip('dist.zip'))
        .pipe(gulp.dest('dist/'));
});

/**
 * Copy assets
 */
gulp.task('build-assets', ['copy-bower_fonts', 'custom-less', 'custom-    css']);

gulp.task('copy-bower_fonts', function() {
    return gulp.src(paths.bower_fonts)
        .pipe(rename({
            dirname: '/fonts'
        }))
        .pipe(gulp.dest('dist/'));
});

gulp.task('custom-less', function() {
    return gulp.src(paths.styles)
        .pipe(less())
        .pipe(gulp.dest('dist/styles'));
});

gulp.task('custom-css', function() {
    return gulp.src(paths.custom_css)
        .pipe(minifyCss())
        .pipe(concat('custom.min.css'))
        .pipe(gulp.dest('dist/styles'));
});

gulp.task('copy-templates', function() {
    return gulp.src(paths.templates)
        .pipe(minifyHTML().on('error',logerror))
        .pipe(gulp.dest('dist/views'));
});

/**
 * Watch custom files
 */
gulp.task('watch', function() {
    gulp.watch([paths.index], ['usemin']);
    gulp.watch([paths.customstyle], ['usemin']);
    gulp.watch([ 'dist/**/*.*', '!dist/dist.zip', '!dist/index.html'], ['zip']);
});

/**
 * Live reload server
 */
gulp.task('webserver', function() {
    connect.server({
        root: 'dist',
        livereload: true,
        port: 8888
    });
});

gulp.task('livereload', function() {
    gulp.src(['dist/**/*.*'])
        .pipe(watch())
        .pipe(connect.reload());
});

/**
 * Gulp tasks
 */
gulp.task('build', ['build-assets','copy-templates', 'usemin']);
gulp.task('default', ['build', 'zip']);
gulp.task('run', ['build', 'webserver', 'livereload', 'watch']);

当我运行默认任务时,我收到此消息:

  

TypeError:Path必须是字符串。收到未定义的

如果我从索引中删除<script src="scripts/directives/directive2/directive2.js" type="text/javascript"></script> gulp任务运行没有错误,我很确定文件在那里并且url写得正确。

请帮助!!

1 个答案:

答案 0 :(得分:1)

我找到的解决方案是将{mangle:false}传递给&#39; gulp-uglify&#39;构造函数,在我的情况下替换

gulp.task('usemin', function() {
    return gulp.src(paths.index)
        .pipe(usemin({
            js: [minifyJs({mangle:false}).on('error', function(e){ console.log(e); }), 'concat'],
            css: [minifyCss({keepSpecialComments: 0}), 'concat']
        }))
        .pipe(gulp.dest('dist/'));
});

此帖中的更多信息:Gulp ngmin + uglify not working properly