angular 在我使用 $uibModal 的控制器的 gulp-uglify 和 gulp-concat 之后中断
angular breaks after gulp-uglify and gulp-concat for controllers where I have used $uibModal
这是我的gulpfile.js
var gulp = require('gulp');
var uglify = require('gulp-uglify');
var concat = require('gulp-concat');
var livereload = require('gulp-livereload');
var del = require('del');
var minifyCss = require('gulp-minify-css');
var autoprefixer = require('gulp-autoprefixer');
var rename = require('gulp-rename');
var htmlmin = require('gulp-htmlmin');
var ngAnnotate = require('gulp-ng-annotate');
var sourcemaps = require('gulp-sourcemaps');
var paths = {
html: {entry: ['public/angular/entry.html'], partials: ['public/angular/partials/**/*.html'], views: ['public/angular/views/**/*.html']},
dist: 'public/dist',
bower_components: ['bower_components/jquery/dist/jquery.min.js', 'bower_components/jquery.cookie/jquery.cookie.js', 'bower_components/bootstrap/dist/js/bootstrap.min.js', 'bower_components/jquery.nicescroll/jquery.nicescroll.min.js','bower_components/jquery-sparkline/dist/jquery.sparkline.min.js', 'bower_components/jquery.easing/jquery.easing.min.js', 'bower_components/bootbox.js/bootbox.js', 'bower_components/retina.js/dist/retina.min.js', 'bower_components/angular/angular.min.js', 'bower_components/angular-sanitize/angular-sanitize.min.js', 'bower_components/angular-touch/angular-touch.min.js', 'bower_components/angular-animate/angular-animate.min.js', 'bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js', 'bower_components/oclazyload/dist/ocLazyLoad.min.js', 'bower_components/angular-ui-router/release/angular-ui-router.min.js', 'bower_components/angular-ui-router/release/stateEvents.min.js', 'bower_components/angular-loading-bar/build/loading-bar.min.js', 'bower_components/angular-ui-select/dist/select.js', 'bower_components/checklist-model/checklist-model.js'],
app_scripts: ['public/angular/scripts/app.js', 'public/angular/scripts/**/*.js'],
app_styles: ['public/angular/styles/reset.css', 'public/angular/styles/layout.css', 'public/angular/styles/components.css', 'public/angular/styles/plugins.css', 'public/angular/styles/themes/green-army.theme.css', 'public/angular/styles/custom.css', 'public/angular/styles/layout/header-loggedin.css', 'public/angular/styles/layout/header-loggedout.css', 'public/angular/styles/pages/sign-in.css', 'public/angular/styles/pages/pos.css', 'public/angular/styles/pages/brand.css', 'public/angular/styles/pages/products.css', 'public/angular/styles/pages/pricing.css', 'public/angular/styles/pages/landing-page.css', 'public/angular/styles/pages/company-profile.css', 'public/angular/styles/invoice-print.css', 'public/angular/styles/angular-custom.css'],
bower_components_styles: ['bower_components/bootstrap/dist/css/bootstrap.min.css', 'bower_components/font-awesome/css/font-awesome.min.css', 'bower_components/animate.css/animate.min.css', 'bower_components/angular-loading-bar/build/loading-bar.min.css', 'bower_components/angular-ui-select/dist/select.min.css', 'bower_components/angular-ui-select/dist/select.css', 'bower_components/angular-bootstrap/ui-bootstrap-csp.css']
};
gulp.task('clean', function () {
return del.sync([paths.dist]);
});
gulp.task('html', ['mainHtml', 'partialsHtml', 'viewsHtml'], function() {
console.log('copying html files started');
});
gulp.task('mainHtml', function() {
gulp.src(paths.html.entry)
.pipe(htmlmin({collapseWhitespace: true}))
.pipe(rename('index.html'))
.pipe(gulp.dest(paths.dist));
});
gulp.task('partialsHtml', function() {
gulp.src(paths.html.partials)
.pipe(htmlmin({collapseWhitespace: true}))
.pipe(gulp.dest(paths.dist + '/partials'));
});
gulp.task('viewsHtml', function() {
gulp.src(paths.html.views)
.pipe(htmlmin({collapseWhitespace: true}))
.pipe(gulp.dest(paths.dist + '/views'));
});
gulp.task('styles', ['bower-styles', 'app-styles'], function(){
console.log('starting styles task');
})
gulp.task('bower-styles', function(){
return gulp.src(paths.bower_components_styles)
.pipe(autoprefixer())
.pipe(concat('bower_styles.css'))
.pipe(minifyCss())
.pipe(gulp.dest(paths.dist))
})
gulp.task('fonts', function() {
return gulp.src(['bower_components/font-awesome/fonts/fontawesome-webfont.*'])
.pipe(gulp.dest('public/dist/fonts/'));
});
gulp.task('app-styles', function(){
return gulp.src(paths.app_styles)
.pipe(autoprefixer())
.pipe(concat('app_styles.css'))
.pipe(minifyCss())
.pipe(gulp.dest(paths.dist))
})
gulp.task('scripts', ['bower_scripts','app_scripts'], function(){
console.log('starting scripts task');
})
gulp.task('bower_scripts', function(){
console.log('starting bower scripts task');
return gulp.src(paths.bower_components)
.pipe(sourcemaps.init())
.pipe(ngAnnotate())
.pipe(uglify({mangle:false}))
.pipe(concat('bower_scripts.js'))
.pipe(sourcemaps.write())
.pipe(gulp.dest(paths.dist))
})
gulp.task('app_scripts', function(){
console.log('starting app scripts task');
return gulp.src(paths.app_scripts)
.pipe(sourcemaps.init())
.pipe(ngAnnotate())
.pipe(uglify({mangle:false}))
.pipe(concat('app_scripts.js'))
.pipe(sourcemaps.write())
.pipe(gulp.dest(paths.dist))
})
gulp.task('default', ['clean', 'html', 'styles', 'fonts', 'scripts'], function(){
console.log('starting default task');
})
这是为特定控制器生成的输出
"use strict";angular.module("sbApp").controller("BrandsCtrl",["$scope","$rootScope","$state","CustomStorage","Brands","$uibModalStack",function($scope,$rootScope,$state,CustomStorage,Brands,$uibModalStack){$scope.vm={brand:{title:"",description:""}},$scope.createBrand=function(){return $scope.vm.errorMsg="",$scope.vm.successMsg="",""==$scope.vm.brand.title||null==$scope.vm.brand.title||void 0==$scope.vm.brand.title||$scope.vm.brand.title.length<3||$scope.vm.brand.title.length>30?$scope.vm.errorMsg="The title must be min 3 max 30 letters":""==$scope.vm.brand.description||null==$scope.vm.brand.description||void 0==$scope.vm.brand.description?$scope.vm.errorMsg="Description is required":$scope.vm.brand.description.length<3||$scope.vm.brand.description.length>1e3?$scope.vm.errorMsg="Description must be min 3 max 1000 letters.":($scope.displaySpinner=!0,void Brands.addNew($scope.vm.brand).then(function(response){$scope.vm.brand.title="",$scope.vm.brand.description="",$scope.vm.successMsg=response.data.title+" added successfully."},function(err){$scope.vm.errorMsg=err.data.message?err.data.message:err.data.msg})["finally"](function(){$scope.displaySpinner=!1}))},$scope.disposeModal=function(){$uibModalStack.dismissAll()}}]);
ui.bootstrap 模块 、angular.min.js:123
出现错误
错误：
[$injector:unpr]
http://errors.angularjs.org/1.6.4/$injector/unpr?p0=%24uibModalStackProvider%20%3C-%20%24uibModalStack%20%3C-%20InvoiceCtrl%20%3C-%20BrandsCtrl
我已经在mugulpfile.js中使用了gulp-ng-annotate,.pipe(uglify({mangle:false}))。请指出它在哪里破坏了我的 $uibModal 应用程序，为什么？
angular 版本 - AngularJS v1.6.4
节点
看来你应该添加对 ui.bootstrap 模块的依赖：
angular.module("sbApp", ["ui.bootstrap"])...
存在重复文件，concat 实际上添加了相同的文件两次
这是我的gulpfile.js
var gulp = require('gulp');
var uglify = require('gulp-uglify');
var concat = require('gulp-concat');
var livereload = require('gulp-livereload');
var del = require('del');
var minifyCss = require('gulp-minify-css');
var autoprefixer = require('gulp-autoprefixer');
var rename = require('gulp-rename');
var htmlmin = require('gulp-htmlmin');
var ngAnnotate = require('gulp-ng-annotate');
var sourcemaps = require('gulp-sourcemaps');
var paths = {
html: {entry: ['public/angular/entry.html'], partials: ['public/angular/partials/**/*.html'], views: ['public/angular/views/**/*.html']},
dist: 'public/dist',
bower_components: ['bower_components/jquery/dist/jquery.min.js', 'bower_components/jquery.cookie/jquery.cookie.js', 'bower_components/bootstrap/dist/js/bootstrap.min.js', 'bower_components/jquery.nicescroll/jquery.nicescroll.min.js','bower_components/jquery-sparkline/dist/jquery.sparkline.min.js', 'bower_components/jquery.easing/jquery.easing.min.js', 'bower_components/bootbox.js/bootbox.js', 'bower_components/retina.js/dist/retina.min.js', 'bower_components/angular/angular.min.js', 'bower_components/angular-sanitize/angular-sanitize.min.js', 'bower_components/angular-touch/angular-touch.min.js', 'bower_components/angular-animate/angular-animate.min.js', 'bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js', 'bower_components/oclazyload/dist/ocLazyLoad.min.js', 'bower_components/angular-ui-router/release/angular-ui-router.min.js', 'bower_components/angular-ui-router/release/stateEvents.min.js', 'bower_components/angular-loading-bar/build/loading-bar.min.js', 'bower_components/angular-ui-select/dist/select.js', 'bower_components/checklist-model/checklist-model.js'],
app_scripts: ['public/angular/scripts/app.js', 'public/angular/scripts/**/*.js'],
app_styles: ['public/angular/styles/reset.css', 'public/angular/styles/layout.css', 'public/angular/styles/components.css', 'public/angular/styles/plugins.css', 'public/angular/styles/themes/green-army.theme.css', 'public/angular/styles/custom.css', 'public/angular/styles/layout/header-loggedin.css', 'public/angular/styles/layout/header-loggedout.css', 'public/angular/styles/pages/sign-in.css', 'public/angular/styles/pages/pos.css', 'public/angular/styles/pages/brand.css', 'public/angular/styles/pages/products.css', 'public/angular/styles/pages/pricing.css', 'public/angular/styles/pages/landing-page.css', 'public/angular/styles/pages/company-profile.css', 'public/angular/styles/invoice-print.css', 'public/angular/styles/angular-custom.css'],
bower_components_styles: ['bower_components/bootstrap/dist/css/bootstrap.min.css', 'bower_components/font-awesome/css/font-awesome.min.css', 'bower_components/animate.css/animate.min.css', 'bower_components/angular-loading-bar/build/loading-bar.min.css', 'bower_components/angular-ui-select/dist/select.min.css', 'bower_components/angular-ui-select/dist/select.css', 'bower_components/angular-bootstrap/ui-bootstrap-csp.css']
};
gulp.task('clean', function () {
return del.sync([paths.dist]);
});
gulp.task('html', ['mainHtml', 'partialsHtml', 'viewsHtml'], function() {
console.log('copying html files started');
});
gulp.task('mainHtml', function() {
gulp.src(paths.html.entry)
.pipe(htmlmin({collapseWhitespace: true}))
.pipe(rename('index.html'))
.pipe(gulp.dest(paths.dist));
});
gulp.task('partialsHtml', function() {
gulp.src(paths.html.partials)
.pipe(htmlmin({collapseWhitespace: true}))
.pipe(gulp.dest(paths.dist + '/partials'));
});
gulp.task('viewsHtml', function() {
gulp.src(paths.html.views)
.pipe(htmlmin({collapseWhitespace: true}))
.pipe(gulp.dest(paths.dist + '/views'));
});
gulp.task('styles', ['bower-styles', 'app-styles'], function(){
console.log('starting styles task');
})
gulp.task('bower-styles', function(){
return gulp.src(paths.bower_components_styles)
.pipe(autoprefixer())
.pipe(concat('bower_styles.css'))
.pipe(minifyCss())
.pipe(gulp.dest(paths.dist))
})
gulp.task('fonts', function() {
return gulp.src(['bower_components/font-awesome/fonts/fontawesome-webfont.*'])
.pipe(gulp.dest('public/dist/fonts/'));
});
gulp.task('app-styles', function(){
return gulp.src(paths.app_styles)
.pipe(autoprefixer())
.pipe(concat('app_styles.css'))
.pipe(minifyCss())
.pipe(gulp.dest(paths.dist))
})
gulp.task('scripts', ['bower_scripts','app_scripts'], function(){
console.log('starting scripts task');
})
gulp.task('bower_scripts', function(){
console.log('starting bower scripts task');
return gulp.src(paths.bower_components)
.pipe(sourcemaps.init())
.pipe(ngAnnotate())
.pipe(uglify({mangle:false}))
.pipe(concat('bower_scripts.js'))
.pipe(sourcemaps.write())
.pipe(gulp.dest(paths.dist))
})
gulp.task('app_scripts', function(){
console.log('starting app scripts task');
return gulp.src(paths.app_scripts)
.pipe(sourcemaps.init())
.pipe(ngAnnotate())
.pipe(uglify({mangle:false}))
.pipe(concat('app_scripts.js'))
.pipe(sourcemaps.write())
.pipe(gulp.dest(paths.dist))
})
gulp.task('default', ['clean', 'html', 'styles', 'fonts', 'scripts'], function(){
console.log('starting default task');
})
这是为特定控制器生成的输出
"use strict";angular.module("sbApp").controller("BrandsCtrl",["$scope","$rootScope","$state","CustomStorage","Brands","$uibModalStack",function($scope,$rootScope,$state,CustomStorage,Brands,$uibModalStack){$scope.vm={brand:{title:"",description:""}},$scope.createBrand=function(){return $scope.vm.errorMsg="",$scope.vm.successMsg="",""==$scope.vm.brand.title||null==$scope.vm.brand.title||void 0==$scope.vm.brand.title||$scope.vm.brand.title.length<3||$scope.vm.brand.title.length>30?$scope.vm.errorMsg="The title must be min 3 max 30 letters":""==$scope.vm.brand.description||null==$scope.vm.brand.description||void 0==$scope.vm.brand.description?$scope.vm.errorMsg="Description is required":$scope.vm.brand.description.length<3||$scope.vm.brand.description.length>1e3?$scope.vm.errorMsg="Description must be min 3 max 1000 letters.":($scope.displaySpinner=!0,void Brands.addNew($scope.vm.brand).then(function(response){$scope.vm.brand.title="",$scope.vm.brand.description="",$scope.vm.successMsg=response.data.title+" added successfully."},function(err){$scope.vm.errorMsg=err.data.message?err.data.message:err.data.msg})["finally"](function(){$scope.displaySpinner=!1}))},$scope.disposeModal=function(){$uibModalStack.dismissAll()}}]);
ui.bootstrap 模块 、angular.min.js:123
出现错误错误：
[$injector:unpr] http://errors.angularjs.org/1.6.4/$injector/unpr?p0=%24uibModalStackProvider%20%3C-%20%24uibModalStack%20%3C-%20InvoiceCtrl%20%3C-%20BrandsCtrl
我已经在mugulpfile.js中使用了gulp-ng-annotate,.pipe(uglify({mangle:false}))。请指出它在哪里破坏了我的 $uibModal 应用程序，为什么？
angular 版本 - AngularJS v1.6.4 节点
看来你应该添加对 ui.bootstrap 模块的依赖：
angular.module("sbApp", ["ui.bootstrap"])...
存在重复文件，concat 实际上添加了相同的文件两次