Генератор Yeoman-angular: «задача wiredep» отсутствует в gulpfile, а $.useref.restore не является функцией

Я только начал использовать Yeoman для создания нового приложения Angular. Я следовал руководству по установке на generator-angular, но решил использовать gulp вместо grunt для запуска задач. .

После установки я получил ошибку: task 'wiredep' is not in you gulpfile.

Я попытался запустить сборку с помощью gulp и получил ошибку: TypeError: $.useref.restore is not a function

Если я запускаю gulp serve, результирующая страница не связывает зависимости.

Есть ли исправление ошибок выше?

Я заметил, что Yeoman использует grunt, а gulp является экспериментальным, поэтому я предполагаю, что вышеописанные ошибки ожидаемы. Должен ли я опубликовать это как проблему на странице генератора GitHub?


person Anugerah Erlaut    schedule 01.11.2015    source источник


Ответы (2)


Там мало проблем.

1-й выпуск йомен имеет в виду gulp wiredep, а не gulp bower: переименуйте gulp.task('bower', function ()в { gulp.task('wiredep', function () {

2-я проблема заключается в том, что библиотеки Bower находятся не в directory: yeoman.app + '/bower_components', а в directory: 'bower_components',

3-й выпуск .pipe(gulp.dest(yeoman.app + '/views')); находится не в папке представлений, а в папке .pipe(gulp.dest(yeoman.app ));

Короче говоря, замените gulp.task('bower', function ... на:

gulp.task('wiredep', function () {
return gulp.src(paths.views.main)
.pipe(wiredep({
  directory: 'bower_components',
  ignorePath: '..'
}))
.pipe(gulp.dest(yeoman.app ));
});

Удалите папку dist, запустите gulp wiredep, gulp и gulp serve или добавьте задачу wiredep в сборку.

Надеюсь, это прояснит это.

person Patrik Bego    schedule 18.03.2016
comment
Он работает для задачи «сборка», но когда я запускаю задачу «служить» gulp, она не работает. Есть идеи? - person Adrian Rodriguez; 18.03.2016
comment
Вывод журнала консоли был бы хорош... Но попробуйте изменить порт. Сервер запустился у меня без проблем (из коробки), только в индексе отсутствовали проводные зависимости. - person Patrik Bego; 20.03.2016
comment
@PatrikBego После рекомендованных вами изменений ошибка исчезла, но компоненты Bower по-прежнему не связаны. Ошибка представляет собой простую ошибку 404 для всех компонентов Bower: GET localhost:9000/bower_components/ bootstrap/dist/css/ (index):75 GET localhost:9000/ bower_components/jquery/dist/jquery.js (index):76 GET localhost:9000 /bower_components/angular/angular.js (index):77 GET localhost:9000/bower_components/bootstrap/dist/js/bootstrap.js (index):78 GET localhost:9000/bower_components/angular-animate/ ... и это продолжается! - person user1242321; 15.06.2016

Я столкнулся с той же проблемой. Я решил это, внеся следующие изменения в задачу gulp «client: build». ОДНАКО, решение этого просто приведет вас к следующей проблеме. Часы не работают, перезагрузка в реальном времени не работает, и у меня больше не было времени пытаться найти другие проблемы. Но я вижу, что о вашей ошибке сообщили на Github (ссылка для справки: https://github.com/yeoman/generator-angular/issues/1199), так что будем надеяться, что кто-то сможет это исправить.

Кроме того, как вы сказали, Gulp является экспериментальным в этом генераторе.

gulp.task('client:build', ['html', 'styles'], function() {
var jsFilter = $.filter('**/*.js');
var cssFilter = $.filter('**/*.css');

var assets = $.useref.assets({
    searchPath: [yeoman.app, '.tmp']
});

return gulp.src(paths.views.main)
    .pipe(assets)
    .pipe(jsFilter)
    .pipe($.ngAnnotate())
    .pipe($.uglify())
    .pipe(jsFilter.restore())
    .pipe(cssFilter)
    .pipe($.minifyCss({
      cache: true
    }))
    .pipe(cssFilter.restore())
    .pipe($.rev())
    .pipe(assets.restore())
    .pipe($.revReplace())
    .pipe($.useref())
    .pipe(gulp.dest(yeoman.dist));
});
person Kidde82    schedule 04.11.2015