Я пытаюсь узнать gulp. У меня есть задача, которая объединяет все js lib в один lib.min.js
gulp.task("lib-js:build", function () {
return gulp.src(templates[template].src.libsJs)
.pipe(concat("libs.min.js"))
.pipe(uglify())
.pipe(gulp.dest(templates[template].dist.js));
});
variable templates[template].src.libsJs
- это массив со следующими значениями:
var templates = {
balmy: {
dist: {
default: "templates/balmy/dist",
html: "templates/balmy/dist/",
js: "templates/balmy/dist/resources/js/",
css: "templates/balmy/dist/resources/css/",
fonts: "templates/balmy/dist/resources/fonts/",
img: "templates/balmy/dist/resources/img/"
},
src: {
html: "templates/balmy/*.html",
js: "templates/balmy/resources/js/*.js",
css: "templates/balmy/resources/css/balmy.css",
fonts: "templates/balmy/resources/fonts/**/*.*",
fontsCss: "templates/balmy/resources/css/fonts.css",
img: "templates/balmy/resources/img/**/*.*",
libsJs: [
"lib/jquery/v3.1.1/jquery-3.1.1.min.js",
"lib/jquery-easing/v1.3/jquery.easing.min.js",
"lib/bootstrap/v4.0.0-alpha.6/bootstrap.min.js",
"lib/magnific-popup/v1.1.0/magnific-popup.js",
"lib/owl-carousel/v2.2.1/owl.carousel.min.js",
"lib/bootstrap-multiselect/bootstrap-multiselect.min.js",
"lib/bootstrap-multiselect/bootstrap-multiselect-collapsible-groups.min.js",
"lib/viewportchecker/v1.8.7/viewportchecker.min.js"
],
libsCss: [
"lib/owl-carousel/v2.2.1/owl.carousel.min.css",
"lib/owl-carousel/v2.2.1/owl.theme.default.min.css",
"lib/animation/v3.5.1/animate.min.css",
"lib/magnific-popup/v1.1.0/magnific-popup.css",
"lib/bootstrap-multiselect/bootstrap-multiselect.min.css"
]
},
needBootstrap: true
}
}
Где templates
является переменной, которая описывает весь возможный шаблон сайта. Когда я буду excecute:
gulp build --template balmy
Я также устанавливаю parametr с именем шаблона, который хотел бы построить.
После этого я включаю этот js файл в свой html и пытаюсь использовать функцию совой карусели:
<script src="resources/js/libs.min.js"></script>
<script>
$(document).ready(function () {
$(".all-events-carousel").owlCarousel({
loop: true,
margin: 10,
items: 1,
animateOut: 'slideOutDown',
animateIn: 'flipInX',
autoplay: true
})
});
</script>
Этот код близко к нижней части тела. В консоли браузера я вижу следующее исключение:
Но если удалить из html concat js и добавить все сжатые js файлы, он будет работать нормально.
Это результат libs.min.js, который только конкатенирован и не был сокращен (без вызова uglify)
Может кто-нибудь знает, почему это происходит?