2

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

  • 第三方库(jquery、bootstrap、jquery 插件等)
  • 自定义库
  • 代码嵌入在 html 中的视图文件之间<script>$(function(){});</script>

很标准的东西。

我的目标是找到一种可靠、自动化的方法,将我所有单独的 javascript 文件(大约 25 个文件)压缩到一个文件中以用于生产。

我已经安装了bower,这似乎是让我的外部库保持最新的好方法。我也安装了grunt. 我在 grunt 中使用了一个 bower 插件,它将所有下载的文件复制到指定的目录,然后concat可以在该目录中查看以组合它们并最终uglifyJS缩小文件。同样,这似乎是 grunt 的标准设置。

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

vendorjs

 - bootstrap.js
 - jquery.js
 - etc

concat然后将从该目录中读取,并且由于文件按字母顺序排列,它们将以不正确的顺序组合,在 jquery 之前引导,因此它不会有用。

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

是否有一些我缺少的配置可以帮助解决我的问题?我会以错误的方式解决这个问题吗?


编辑这是我的 Gruntfile.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']
            }
        }
    }
});

};

4

1 回答 1

2

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

grunt.initConfig({
  concat: {
    dist: {
      src: ['src/jquery.js', 'src/bootstrap.js'],
      dest: 'dist/built.js'
    }
  }
});
于 2013-06-20T12:32:58.753 回答