JS的依赖管理

Question

我目前正在使用Bower进行依赖项管理，该管理器通过一个命令下载我所有的项目依赖项。 现在我也开始使用Gruntjs。 现在的问题是，当我想使用Bower下载例如jQuery依赖项时，它也在libs文件夹中也下载了其他几个js文件。 然后，我使用grunt使用libs文件夹中的jQuery库最小化所有编写的JavaScript。 现在的问题是，它还会最小化和隐藏jquery文件夹中使用Bower加载的那些不必要的文件。

我的问题是，有没有办法让Bower仅下载jquery.js文件，还是有一种方法让grunt将我的其余代码仅连接jquery.js文件？

如果是，那怎么办？

更新

    module.exports = function (grunt) {
        grunt.initConfig({

            jshint: {
                options: {
                    jshintrc: '.jshintrc'
                },
                target: {
                    src: 'src/js/**/*.js'
                }
            },

            csslint: {
                options: {
                    csslintrc: '.csslintrc'
                },
                target: {
                    src: 'src/css/**/*.css'
                }
            },

            copy: {
                dist: {
                    cwd: 'src/', expand: true, src: '**', dest: 'dist/'
                }
            },

            concat: {
                options: {
                    // separator: ';'
                },
                target: {
                    src: ['dist/js/jquery.js', 'dist/js/**/*.js'], // make sure jquery is loaded first
                    dest: 'dist/js/compiled.js'
                }
            },

            uglify: {
                options: {
                    mangle: true,
                    compress: true,
                    banner: '/* Test banner */\n'
                },
                target: {
                    src: 'dist/js/compiled.js',
                    dest: 'dist/scripts/compiled.min.js'
                }
            },

            uncss: {
                dist: {
                    files: [
                        { src: 'src/*.html', dest: 'dist/css/compiled.min.css' }
                    ]
                }
            },

            cssmin: {
                options: {
                    // banner: '/* My minified css file */'
                },
                target: {
                    src: 'dist/css/*.css',
                    dest: 'dist/styles/compiled.min.css'
                }
            },

            // Deletes all .js files, but skips min.js files
            clean: ['dist/js/', 'dist/css/'],

            processhtml: {
                dist: {
                    files: {
                        'dist/index.html': ['src/index.html']
                    }
                }
            }

        });

        grunt.loadNpmTasks('grunt-contrib-jshint');
        grunt.loadNpmTasks('grunt-contrib-csslint');
        grunt.loadNpmTasks('grunt-contrib-copy');
        grunt.loadNpmTasks('grunt-contrib-concat');
        grunt.loadNpmTasks('grunt-contrib-uglify');
        grunt.loadNpmTasks('grunt-contrib-cssmin');
        grunt.loadNpmTasks('grunt-processhtml');
        grunt.loadNpmTasks('grunt-contrib-clean');
        grunt.loadNpmTasks('grunt-uncss');

        grunt.registerTask('default', ['jshint', 'uncss', 'csslint', 'copy', 'concat', 'uglify', 'cssmin', 'clean', 'processhtml']);
    }

Answer 1

您应该能够告诉Grunt仅将一个JQuery文件用作串联目标，然后将仅选择该值。

我假设您有一个格式为'bower_components / ** / *。js'的glob，而不是执行特定的glob，而应仅制作一个仅包含jquery的glob。 请记住，src文件也可以是数组，而不仅仅是字符串。 您应该能够执行['bower_components / jquery / jquery.js'，'bower_components / path / to / other / lib.js']。