如何在文件夹中uglify多个.js文件并将它们输出到另一个文件夹？

Posted 2021-04-15

我是grunt的新手，在使用插件grunt-contrib-uglify-es时我无法弄清楚如何定义路径。

这是我的文件夹结构：

.
├── controllers
├── models
├── public
│   ├── build
│   │   ├─ foo.min.js
│   │   └─ x.min.js
│   ├── css
│   ├── font
│   └── js
│        ├─ foo.js
│        └─ x.js
├── routes
├── tests
├── utils
└── views

这是我的艰巨任务：

// take all js file in public/js/ and put them in public/build/
uglify: {
  options: {
    mangle: false,
          banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
  },
  build: {
    files: [{
      expand: true,
      src: 'public/js/*.js',
      dest: 'public/build/',
      rename: function (dst, src) {
        console.log(dst);
        console.log(src);
        return src;
      }
    }]
  }
}

当我运行grunt时，它会将文件创建到public/js并覆盖现有文件。我不明白为什么。

我也试过这个：

expand: true,
src: 'js/*.js',
dest: 'build/',
cwd: 'public/',

现在它在根目录下创建了一个新的文件夹js，其中包含所有文件。

我想压缩.js中的每个public/js/文件，然后将它们放入public/build/

我很丢失，你能帮帮我吗？

答案

为了满足您的要求，当您需要使用building the files object dynamically时;

1. cwd选项 - 描述如下： cwd所有src比赛都相对于（但不包括）此路径。
2. rename函数，描述如下： rename嵌入自定义函数，该函数返回包含新目标和文件名的字符串。为每个匹配的src文件调用此函数（在扩展名重命名和展平后）。

步兵文件：

以下配置将满足您的期望结果。

module.exports = function (grunt) {

  grunt.loadNpmTasks('grunt-contrib-uglify-es');

  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    uglify: {
      options: {
        mangle: false,
        banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
      },
      build: {

        // Change your configuration to this...
        files: [{
          expand: true,
          cwd: 'public/js',
          src: '*.js',
          dest: 'public/build/',
          rename: function (dst, src) {
            return dst + '/' + src.replace('.js', '.min.js');
          }
        }]
      }
    }
  });

  grunt.registerTask('default', ['uglify']);
};