Gruntjs 使用bower和grunt管理Javascript包

所以在我的项目中，我的javascript包括

• 第三方库（jquery、引导、jquery插件等）
• 自定义库
• 内嵌在$（function（）{}）之间的html视图文件中的代码

相当标准的东西

我的目标是找到一种可靠的、自动化的方法，将所有单独的javascript文件（大约25个文件）缩小为一个用于生产的文件

我已经安装了

bower

，这似乎是使我的外部库保持最新的好方法。我还安装了

grunt

。我在grunt中使用了一个bower插件，它将所有下载的文件复制到一个指定的目录，然后

concat

可以在该目录中查找并合并它们，最后

uglifyJS

缩小文件。同样，它似乎是grunt的标准设置

bower插件将创建一个文件夹，如

vendorjs

 - bootstrap.js
 - jquery.js
 - etc

concat

将从此目录中读取，由于文件按字母顺序排列，因此将以错误的顺序组合它们，因此在jquery之前引导，因此它将不起作用

我知道RequireJS，但对于我的需求来说，这似乎有些过头了。而且我似乎还需要重写我所有的js，以符合RequireJS的要求

是否有一些配置我缺少，这将有助于我的问题？我是不是走错了路

---

编辑这是我的Grunfile.js，更清晰

grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    bower: {
        dev: {
            dest: 'vendorjs',
            options: {
                stripJsAffix: true
            }
        }
    }
    concat: {
        options: {
            separator: ';'
        },
        dist: {
            src: ['vendorjs/*.js'],
            dest: 'vendor.js'
        }
    },
    uglify: {
        dist: {
            files: {
                '../../public/js/admin/vendor.min.js': ['vendor.js']
            }
        }
    }
});

---

})

我不确定您的配置是什么样的，但您可以在grunt contrib concat中轻松指定文件的顺序：

grunt.initConfig({
  concat: {
    dist: {
      src: ['src/jquery.js', 'src/bootstrap.js'],
      dest: 'dist/built.js'
    }
  }
});

---

感谢您的回复，问题是我正在尝试自动化所有内容，以便自动处理任何依赖项，因此我不想指定确切的文件。但这可能是错误的方法。你不能两全其美。要么指定，要么不指定（按字母顺序排列）。听起来你正在寻找的是RequireJS，但它也有它自己的缺点。是的，我感觉自己好像走到了死胡同，非常感谢你帮助我澄清情况。如果你不喜欢RequireJS的开销，我仍然建议使用AMD，并使用更小的加载程序，如almond.js。AMD的好处是，您可以以任何方式压缩文件，并且它们仍将以正确的顺序执行。对于较小的项目，我会推荐这个。想添加一个基于AMD的答案吗？