用npm腳本替換uglify的gulp任務

Question

目前，我正在使用npm進行程序包管理，Gulp用於運行任務。我想知道如果我能夠使用npm腳本替換吞嚥，並只使用npm。

我對uglifying長相gulpfile.js如下

var uglify = require('gulp-uglify'); 

// Minify JS 
gulp.task('minify-js', function() { 
return gulp.src('js/agency.js') 
.pipe(uglify()) 
.pipe(header(banner, { pkg: pkg })) 
.pipe(rename({ suffix: '.min' })) 
.pipe(gulp.dest('js')) 
.pipe(browserSync.reload({ 
stream: true 
})) 
}); 

有沒有寫在NPM等效腳本的方法嗎？

Answer 1

首先，我建議你有兩個目錄src和dist。

• src包含原始代碼所做的任何minifications之前，它是用來閱讀和編輯你的代碼。
  
• dist代表分佈幷包含代碼的微細化以及級聯版本，它是在生產現場使用。

---

步驟1

您可以使用uglify-js合併和壓縮JavaScript文件。

用下面的命令來安裝它：
npm install --save-dev uglify-js

步驟2

在你的package.json文件中設置新的任務調用醜化：

"scripts": { 
    ... 
    "uglify": "mkdir -p dist/js && uglifyjs src/js/*.js -m -o dist/js/app.js && uglifyjs src/js/*.js -m -c -o dist/js/app.min.js" 
} 

---

說明

這個任務的前半部分，mkdir -p dist/js創建一個文件夾結構（mkdir），但只有當它不存在（-p標誌）。一旦成功完成，請運行uglifyjs命令。 &&可讓您將多個命令鏈接在一起，如果前一個命令成功完成，則依次運行每個命令。

這個任務的後半部分講述uglifyjs在src/js/開始與所有的JS文件（*.js）的，適用「裂傷」命令（-m標誌），並把結果輸出到dist/js/app.js。

並創建一個壓縮版本dist/js/app.js我們鏈接另一個uglifyjs命令並傳遞「compress」（-c）標誌。