使用Grunt连接多个js文件,但希望它们分开?

时间:2015-01-13 10:01:40

标签: javascript angularjs node.js gruntjs grunt-contrib-concat

我是grunt的新手(今天安装它并使用它)并且很棒,但我无法解决问题。

我有一个angularJs项目,我想把我所有的javascript文件整合成3个文件。

所以我会

"基础" - 插件等的所有供应商javascript文件

"应用" - 所有用户使用的所有控制器

"管理" - 所有使用的控制器等,但只有管理员才能访问

现在我已经安装了grunt并为concat设置了我的任务,但是我怎样才能拥有多个dest和src属性?

grunt文件的示例

grunt.initConfig({
    // Metadata
    pkg: grunt.file.readJSON('package.json'),
    concat: {
        options: {
            stripBanners: true
        },
        dist: {
            src: ['Scripts/jquery-*.js', '!Scripts/jquery-*.min.*', '!Scripts/jquery-*.intellisense.*', 'Scripts/bootstrap.js', 'Scripts/respond.js', 'js/**/*.js'],
            dest: 'dist/app.js'
        },
        distCss: {
            src: ['Content/bootstrap.css', 'Content/site.css'],
            dest: 'dist/app.css'
        }
    },
});

一旦我弄明白这一点,我可以使用多个ugilify属性来ugilify创建的每个js文件吗?

1 个答案:

答案 0 :(得分:6)

您可以设置单独的任务,以便在您运行grunt时执行。每个任务都会连接不同的来源。

来自 grunt-contrib-concat

  

在此示例中,运行grunt concat将构建两个单独的文件。一个“基本”版本,主文件基本上只复制到dist / basic.js,另一个“with_extras”连接版本写入dist / with_extras.js。

grunt.initConfig({
  concat: {
    basic: {
      src: ['src/main.js'],
      dest: 'dist/basic.js',
    },
    extras: {
      src: ['src/main.js', 'src/extras.js'],
      dest: 'dist/with_extras.js',
    },
  },
});

之后你需要使用grunt-contrib-uglify插件来缩小grunt-concat的输出文件。