52

私は次の構造を持っています：

src/
    modules/
        module1/
            js/
                main.js
            scss/
                main.scss
            index.html
        module2/
            js/
                main.js
            scss/
                main.scss
            index.html

これらを次の構造にコピーするために、うなり声のタスクを実行したいと思います。

dev/
    js/
        module1.js
        module2.js
    css/
        module1.css
        module2.css
    module1.html
    module2.html

既存のgruntプラグインでこれを行う方法はありますか？そうでない場合、どうすればこれを達成できますか？

4

6 に答える 6

91

これは、grunt-contrib-copyプラグインを使用して実行できます。

注意すべき主な点は、名前変更関数 (各ファイルの宛先とソースを取り込む) を使用してプログラムで宛先を変更できることです。

Gruntfile.jsこれは、目的の構造にコピーする必要がある (やや壊れやすい) サンプルです。

module.exports = function(grunt) {
  // Project configuration.
  grunt.initConfig({
    copy: {
      main: {
        files: [
          {
            expand: true, 
            cwd: 'src/modules/', 
            src: ['**/*.js'], 
            dest: 'dev/js/', 
            rename: function(dest, src) {
              // use the source directory to create the file
              // example with your directory structure
              //   dest = 'dev/js/'
              //   src = 'module1/js/main.js'
              return dest + src.substring(0, src.indexOf('/')) + '.js';
            }
          },
          {
            expand: true, 
            cwd: 'src/modules/', 
            src: ['**/*.scss'], 
            dest: 'dev/css/', 
            rename: function(dest, src) {
              return dest + src.substring(0, src.indexOf('/')) + '.css';
            }
          },
          {
            expand: true, 
            cwd: 'src/modules/', 
            src: ['**/*.html'], 
            dest: 'dev/', 
            rename: function(dest, src) {
              return dest + src.substring(0, src.indexOf('/')) + '.html';
            }
          }
        ]
      }
    }
  });

  grunt.loadNpmTasks('grunt-contrib-copy');

  // Default task(s).
  grunt.registerTask('default', ['copy']);
};
于 2013-03-20T06:23:44.747 に答える
6

grunt-contrib-copyこれだけのために使用する必要はもうありませんgrunt.file.expandMapping。ファイル拡張子を変更するオプションや、出力ファイル名を返す関数を定義するオプションを利用できるようになりました。

.jade テンプレートを .html ファイルにコンパイルfilesするタスクのオブジェクトの例を次に示します。jade

files: [{
    expand: true, 
    src: "**/*.jade", 
    dest: "<%= distDir %>", 
    cwd: "<%= assetsDir %>/jade", 
    rename: function(dest, matchedSrcPath, options) {
        // return the destination path and filename:
        return (dest + matchedSrcPath).replace('.jade', '.html');
    }
}]

この場合、ext: '.html'オプションの代わりにオプションを使用する方が簡単だったでしょうが、ここではそれがどのように機能するかを確認できるように使用しています。renamerename

extand rename(およびその他の) オプションの詳細については、 grunt.file docsを参照してください。こことここにいくつかの例があります。

于 2015-01-18T15:04:42.787 に答える
0

ファイルを見つけたルートに作成された min フォルダーにファイルを保存したかったので、プラグインフォルダーを別のプロジェクトに移動するのがより簡単になりました。

-- Plugins/    
     -- bootstrap/                
            -- bootstrap.js
            -- bootstrap.css
            -- min/
                 -- bootstrap.min.js
                 -- bootstrap.min.css

このページのおかげで見つけた解決策を投稿します 多分それは他の人を助けることができます:

uglify: {
    options: {
        mangle: true
    },
    dynamic_mappings: {
        // Grunt will search for "**/*.js" under "Plugins/" when the "uglify" task
        // runs and build the appropriate src-dest file mappings then, so you
        // don't need to update the Gruntfile when files are added or removed.
        files: [
            {
                expand: true,     // Enable dynamic expansion.
                cwd: 'Plugins/',  // Src matches are relative to this path.
                src: ['**/*.js', '!**/*.min.js'], // Pattern to match (ignore .min files)
                dest: '/min/',     // Destination path prefix.
                ext: '.min.js',   // Dest filepaths will have this extension.
                extDot: 'last',   // Extensions in filenames begin after the first dot
                rename: function( dest, matchedPath, options ) {

                    Pathname = matchedPath.substring( 0, matchedPath.indexOf('/') );
                    Filename = matchedPath.replace( Pathname, '' );

                    //Return "Plugins / plugin_folder / min / file_name.min.js"
                    return options.cwd + Pathname + dest + Filename;
                }
            },
        ],
    },
}
于 2021-03-20T06:22:13.420 に答える