用gulp連接並丑化成幾個文件

Question

作為此操作的結果，我需要獲取兩個文件：vendor.js和bundle.js。 它們也應該是丑陋的，但是變量名必須在它們之間保持一致，但是到目前為止，它要么是丑陋的，要么是兩個文件。

 <!-- build:js1 vendor.js --> <script src="bower_components/angular/angular.js"></script> <script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script> <script src="bower_components/angular-aria/angular-aria.js"></script> <script src="bower_components/angular-animate/angular-animate.js"></script> <script src="bower_components/angular-material/angular-material.js"></script> <!-- endbuild --> <!-- build:js2 bundle.js --> <script src="js/app.js"></script> <script src="components/stores.js"></script> <script src="components/userInfo/UserInfo.js"></script> <script src="components/userMenu/UserMenu.js"></script> <script src="components/components.js"></script> <!-- endbuild --> 

Answer 1

請使用AngularJS本身提供的縮小版本。 當已經提供了這些你不應該丑化第三方的依賴。

因此，您應該將角度和所有其他角度組件合並到一個供應商文件中，並進行uglify和合並自己的javascript。 當您查看路徑bower_components / angular /時，還應該有一個angular.min.js文件（以及其他角度組件）。

在https://github.com/elgervb/skeletonSPA上查看針對GulpJS和AngularJS的默認設置。 我使用類似方法。

Answer 2

嘗試這個：

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

gulp.task('concat-js', function () {
    gulp.src(['one.js', 'two.js'])
        .pipe(concatJS('first.js'))
        .pipe(uglify())
        .pipe(gulp.dest('./javascript'));

    gulp.src(['three.js', 'four.js'])
        .pipe(concatJS('second.js'))
        .pipe(uglify())
        .pipe(gulp.dest('./javascript'));
});