Question

我是Grunt的新人，我无法找到我正在寻找的东西。

我有这个文件夹的结构配置：

app/
public/
    assets/
        ... some javascript/css libs like jQuery, Bootstrap, etc
    css/
    js/
    img/

我想要做的是将public/assets/中的所有js文件压缩到assets.js中的js/assets.js个文件中，并为所有css执行相同的操作将文件转换为assets.css中的css/assets.css。

此外，我希望压缩这两个assets.js / css文件。

我需要一个解决方案的链接或解决方案的一些开始。

谢谢！

Answer 1

首先，您需要连接文件，然后通过缩小器运行它们。 Grunt有很多插件可以做这些事情，但是一些比较流行的插件是grunt-contrib-concat，grunt-contrib-uglify和grunt-contrib-cssmin。

这些任务有很多选项可供他们满足您的需求，但这可以帮助您开始。

concat任务的示例配置类似于：

grunt.initConfig({
  concat: {
    options: {
      separator: ';',
    },
    js: {
      src: ['public/assets/a.js', 'public/assets/b.js', 'public/assets/c.js'],
      dest: 'public/js/assets.js',
    },
    js: {
      src: ['public/assets/a.css', 'public/assets/b.css', 'public/assets/c.css'],
      dest: 'public/css/assets.css',
    },
  },
});

然后为你的minify js任务：

uglify: {
    js: {
      files: {
        'public/assets/js/assets.min.js': 'public/assets/js/assets.js'
      }
    }
  }

最后，css缩小任务：

cssmin: {
  files: {
    'public/assets/css/assets.min.css' : 'public/assets/css/assets.css'
  }
}

Grunt可以将特定文件夹中的所有js / css文件合并到一个js / css文件中吗？

1 个答案: