Gulp уродует взлом приложения angular

#javascript #angularjs #gulp #uglifyjs

#javascript #angularjs #глоток #uglifyjs

Вопрос:

При попытке использовать gulp-ugily с моим угловым приложением оно ломается, хотя я его прогоняю gulp-ngmin .

Вот файл gulp:

 var gulp = require('gulp'),
    concat = require('gulp-concat'),
    ngmin = require('gulp-ngmin'),
    uglify = require('gulp-uglify');

gulp.task('compress', function() {
    gulp.src('client/js/source/*.js')
        .pipe(concat('app.js'))
        .pipe(ngmin())
        .pipe(uglify())
        .pipe(gulp.dest('client/js'));
});

1. Как это происходит? Какие-либо подсказки из сообщений об ошибках?

2. Аргумент ‘MyController’ не является функцией, не определен. В основном контроллер.

3. Вау, мне нужно было указать client/js/source/**/*.js , есть ли способ указать просто поиск в обратном порядке?

4. Убедитесь, что вы определили свои зависимости максимально безопасным способом. Должно быть в фигурных скобках, таких как: phonecatApp.controller(‘PhoneListCtrl’, [‘$scope’, ‘$http’, function($scope, $ http) {…}]);. См . docs.angularjs.org/tutorial/step_05 и прокрутите вниз раздел «Примечания по минимизации».

Ответ №1:

Это помогает отключить опцию искажения в uglify, поскольку она мешает всем элементам внедрения и именованию.

 .pipe(uglify({ mangle: false }))

Ответ №2:

Возможно, отвечая на это для будущих пользователей, поскольку кажется, что сообщение старое.

Используйте ng-annotate для устранения проблем AngularJS при уродстве. Установите его как любую другую библиотеку:

 npm install gulp-ng-annotate --save-dev

А затем используйте это в своем gulpfile.js:

 var gulp = require('gulp')
var concat = require('gulp-concat')
var uglify = require('gulp-uglify')
var ngAnnotate = require('gulp-ng-annotate')

gulp.task('js', function () {
  gulp.src(['src/**/module.js', 'src/**/*.js'])
    .pipe(concat('app.js'))
    .pipe(ngAnnotate())
    .pipe(uglify())
    .pipe(gulp.dest('.'))
})

Надеюсь, это помогло!

Источник: https://medium.com/@dickeyxxx/best-practices-for-building-angular-js-apps-266c1a4a6917

1. Я использую это решение на работе, и оно никогда меня не подводило! Спасибо @PhamHuyAnh!

2. да! рабочий ответ. должно быть принято как правильный ответ.

3. Для меня это звучит лучшим решением, потому что .js более уродливы, чем с решением ‘mangle: false’.

4. Примечание: При использовании ES6 у вас могут возникнуть проблемы с ngAnnotate, поскольку он больше не поддерживается. Например, добавление ES6 spread (‘…’) вызовет ошибку синтаксического анализа.

5. Я согласен @Zymotik! Решение было действительно для Angular 1.x в июне 2016 года! Это решение должно быть пересмотрено! =) Но я думаю, что веб-пакеты поняли это для многих языков