nodejs簡単なgulp包装を実現します.

最近は新しい会社に変わりました.創業会社なので、プロジェクトは基本的にゼロから構築します.何年間働いていても、何か技術的なものを書こうとは思っていませんでした.今日は急に気まぐれになりました.もちろん、私はいつも気まぐれになりがちです.一ヶ月間忙しくして、プロジェクトは初めて原形に会って、大体1.0線にもなります.文案を待つ間に、簡単にgulp包装のものを書いてください.明日暇があれば、もう一枚詳細に書いてください.それから、webpackをお願いします.あれ、これは暇があっても、いつなのか分かりません.stop「stop」
初めから来てください.まず、package.jsonファイルを作成して、npm initについて確認して確認してください.構築に何を使うかはnpmでいいです.vueの足場を作ったことがある子供連れは知っているはずです.足場は自動的に特別な全面的なpackage.jsonファイルを生成します.もちろん私達も今はそんなに多く使わないです.多く言いません
もし後で強大な機能を追加するために、私達は多くの書類を作ります.
を選択します.いわゆるSrc、distです.もう一つのglpfile.xx.jsをください.名前は勝手につけてください.引用する時に引用すればいいです.glpfile.jsをもう一つお願いします.最後に運行します.
一番簡単な例を作って、js圧縮を例にして、後でバージョンのハ管理機能を加えて、使い方は全部同じです.何を使って何を加えますか?

var src_file = './xxxx/'; //        
var dist_file= './dist/xxxx/'; //             
var config= {
src: src_file,
dist: dist_file,
js: {
  src: src_file + 'src/js/**/*.js',      //   js  
  dist: dist_file + 'src/js',         // js          
  },
};
module.exports = config;

これは一番簡単な例です.他にリガに行ったらいいです.html、css、img、静的なファイルなどがあります.
肝心なのは来て、私達は処理方法をglpfile.xx.jsの中で書きます.
gulpfile.xx.js:

var gulp = require('gulp');
var rename = require('gulp-rename'); //   
var babel = require("gulp-babel");
var uglify = require('gulp-uglify'); //js  
var config = require('./gulpfile.config.js');
var runSequence = require('run-sequence');
var rev = require('gulp-rev');//          ，     ，     
var revCollector = require('gulp-rev-collector');
var cssUrl = './dist/xxx/src/css/*.css',
   jsUrl = './dist/xxx/src/js/*.js';
function haha() {
  gulp.task('js', function () {
    return gulp.src(Config.js.src)
          .pipe(babel())
          .pipe(uglify())
          .pipe(gulp.dest(config.js.dist));
    });
  gulp.task('revJs', function(){
    return gulp.src(jsUrl)
          .pipe(rev())
          .pipe(rev.manifest())
          .pipe(gulp.dest('dist/xxx/src/js'));
  });
  gulp.task('revHtml', function () {
        return gulp.src(['dist/xxx/src/js/**/*.json', 'chaohuo/*.html']) /*    html     ，     */
          .pipe(revCollector(
            { replaceReved:true }
            ))
          .pipe(gulp.dest('dist/chaohuo')); /*Html  css、js    ,   html       */
  });
  gulp.task('dev', function (done) {
      condition = false;
      runSequence(
          ['revJs'],
          ['revHtml'],
    done);});
    gulp.task('default', ['js','dev']);
}
module.exports = haha;

日よ、一歩ずつはっきり書きたいと思っていましたが、バージョン番号に関するものは全部書きました.それはいいです.一緒に来てください.
以下はgulpfile.jsファイルです.

var haha= require('./gulpfile.prod.js');
haha();

基本的な仕事はもう半分以上できました.もう一つ言い忘れました.s 6文法を使ったら、設定を忘れないでください.babelrcファイルです.
babelrcの内容:

  "presets": [
    "es2015",
  ],
  "plugins": [
    "transform-remove-strict-mode"//              。
  ]
}

ある子供たちはバージョン番号が重複している問題に出会うかもしれません.これを覚えていますか?前を見て、これを追加してください.最後の一歩があります.modulesコードを変更します.来てください.最新のカバン(古いものを使ったら、同じように変更します.)を換えてください.
gulp-pathの中のindex.jsの二つのreturnのものは全部変えます.

return modifyFilename(pth, (filename, ext) => `${filename}-${hash}${ext}`);  return modifyFilename(pth, (filename, ext) => `${filename}${ext}`);

return modifyFilename(pth, (filename, ext) => filename.replace(new RegExp(`-${hash}$`), '') + ext);  return modifyFilename(pth, (filename, ext) => filename + ext);

gulp-rev-collectorのindex.js:
128行ぐらいです 

patterns.push( escPathPattern( (path.dirname(key) === '.' ? '' : closeDirBySep(path.dirname(key)) ) )
+ path.basename(key, path.extname(key))
.split('.')
.map(function(part){
return escPathPattern(part) + '(' + opts.revSuffix + ')?';
})
.join('\\.')
+ patternExt
);

この部分は

patterns.push( escPathPattern( (path.dirname(key) === '.' ? '' : closeDirBySep(path.dirname(key)) ) + path.basename(key, path.extname(key)) ) + opts.revSuffix + escPathPattern( path.extname(key) ) + "(\\?v=(\\d|[a-z]){8,10})*" );

ここで関連しているのもネットでたくさんの関連資料を調べましたが、どれも古いバージョンのようです.しかもgulp-revの中のファイルは修正しなくてもいいです.ここでも何回もテストしました.以上は基本的に使えます.
はい、成功までもう遠くないです.cmdはgulp命令を実行して、ok、基本的に完成します.確認してください.
注意:すべてのrequireのものはnpmを覚えています.カードはcnpmです.多くは言いません.
また、手で打つものが多いので、スペルやファイルパスの誤りがあるかもしれません.変更を確認してください.
詳しく書きたいですが、今日はこのままにしましょう.出張はここで終わります.姉もレンガを運んできます.問題があったら送ってください.時間があれば帰ります.ちょっと乱れています.