Ошибка "Определить не определена" при установке JQuery с Bower

Мое здравомыслие находится на грани разрушения...

Я играю с bower, чтобы установить jQuery вместе с slick-carousel, но все не сработает. Но позвольте мне объяснить шаг за шагом.

1. Вот мой файл bower.json. Оба компонента установлены

{
  "name": "the-lens",
  "version": "0.0.1",
  "dependencies": {
    "slick-carousel": "^1.5.9",
    "jquery": "^2.2.3"
  },
  "private": true
}

2. Я использую bowcat для concat jquery с помощью slick. Я проверил финальный файл, и сначала начинается jquery, последний - последним. Имя файла - build.js

3. Я совмещаю свой собственный custom.js с build.js в final all.js(мой код приходит в самом конце).

4. Я ссылаюсь на all.js из моего html-заголовка. Я могу проверить источник страницы и перейти по ссылке, и я вижу, что моя all.js правильно загружена.

5. В моем html я проверяю, загружен ли jquery с внутренним script. Он предупреждает "Yay! Works from internal". Пока все хорошо.

<script type="text/javascript" >
  if (typeof jQuery == 'undefined') {
    alert("Doesn't work from internal");
  } else {
    alert("Yay! Works from internal");
 }
</script>

Ответы

Ответ 1

Итак, я, наконец, понял, что случилось. Вернее, я нашел решение, а не точную проблему.

Подобно @evolutionxbox, указанному в комментариях выше, проблема была с bowcat. Я не уверен, что js файл, который он выбирает из папки jquery, но, конечно, не был правильным.

Вместо этого я сделал это:

1. Сначала я проверил правильный путь к jquery с помощью $ bower list --paths

$ bower list --paths

'slick-carousel': [
  'bower_components/slick-carousel/slick/slick.min.js',
  'bower_components/slick-carousel/slick/slick.css',
  'bower_components/slick-carousel/slick/slick-theme.css',
  'bower_components/slick-carousel/slick/fonts/*'
],
jquery: 'bower_components/jquery/dist/jquery.js'

2. Затем я использовал эти пути, чтобы вместо gulp конкатенировать мои файлы. Ниже приведен код из моего gulpfile.js

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

gulp.task('scripts', function() {
    return gulp.src([
    './bower_components/jquery/dist/jquery.js',
    './bower_components/slick-carousel/slick/slick.min.js',
    './app/Resources/javascript/custom.js'
   ])
  .pipe(concat('all.js'))
  .pipe(gulp.dest('./web/js/'));
});

3. Я запустил мою команду $ gulp scripts, и теперь мой all.js проходит как внутренний, так и внешний тест.

Вывод: Я могу порекомендовать gulp, но не bowcat: P Но опять же, в защиту боутов, я мог бы просто быть полным noob при его использовании... Но что бы то ни было, я отвлекаюсь.

Имейте славных людей дня. Не стесняйтесь комментировать, если у вас есть вопросы к моему решению.