CODEWITHSUNDEEP
javascriptcssgulp
Mongoname
Mongoname

Reputation: 65

Gulp concat plugins error

I'm using gulp for concat my plugins (bootstrap, jquery, etc) in one big file, this is my code:

const gulp = require('gulp');
const csso = require('gulp-csso');
const concat = require('gulp-concat');
const babel = require('gulp-babel');
const uglify = require('gulp-uglify');

gulp.task('build', function() {

gulp.src(["./bower_components/bootstrap/dist/css/bootstrap.min.css", 
         "./bower_components/ekko-lightbox/dist/ekko-lightbox.css",
         "./bower_components/owl.carousel/dist/assets/owl.carousel.min.css",
         "./bower_components/owl.carousel/dist/assets/owl.theme.default.css",
         "./client/css/core.css",
         "./client/css/responsive.css"])
.pipe(csso())
.pipe(concat("main.css"))
.pipe(gulp.dest("./build"));

gulp.src(["./bower_components/jquery/dist/jquery.js",
          "./bower_components/bootstrap/dist/js/bootstrap.bundle.js",
          "./bower_components/ekko-lightbox/dist/ekko-lightbox.min.js",
          "./bower_components/lazysizes/lazysizes.min.js",
          "./bower_components/owl.carousel/dist/owl.carousel.min.js",
          "./bower_components/moment/min/moment.min.js",
          "./bower_components/moment/min/locales.min.js",
          "./client/js/script.js" ])    
.pipe(babel({
        presets: ['es2015']
    }))
.pipe(uglify())
.pipe(concat("main.js"))
.pipe(gulp.dest('./build'));

});

And it's doing OK. But when i'm including this script on my project, console throws my error: Uncaught TypeError: Cannot set property 'bootstrap' of undefined. I tried just concat it without es2015 or uglify, but this error (or another, like moment is not defined) still persists. What am i doing wrong?

Upvotes: 2

Views: 592

Answers (1)

Mongoname
Mongoname

Reputation: 65

Ok, i got it.

npm install --save-dev babel-plugin-proposal-object-rest-spread
npm install --save-dev babel-plugin-transform-object-rest-spread

Then pipe 

.pipe(babel({
    presets: [['env', {
        loose: true,
        modules: false,
        exclude: ['transform-es2015-typeof-symbol']
    }]],
    plugins: ['transform-es2015-modules-strip', 'transform-object-rest-spread']
}))

And it works

Upvotes: 3

Related Questions