I'm having trouble bringing in my ES6 module into a file and using Gulp to concatenate and minimize it. When I try to run it, I keep getting a ReferenceError: require is not defined at all.js(transpiled) line no 3. I've already transpiled the code with gulp-babel.
Here are my js files:
cart.js:
class Cart{
constructor(){
this.cart = [];
this.items = items = [{
id: 1,
name: 'Dove Soap',
price: 39.99
},{
id: 2,
name: 'Axe Deo',
price: 99.99
}];
}
getItems(){
return this.items;
}
}
export {Cart};
app.js:
import {Cart} from 'cart.js';
let cart = new Cart();
console.log(cart.getItems());
gulpfile.js:
"use strict";
let gulp = require('gulp');
let jshint = require('gulp-jshint');
let concat = require('gulp-concat');
let uglify = require('gulp-uglify');
let rename = require('gulp-rename');
let babel = require('gulp-babel');
// Lint Task
gulp.task('lint', function() {
return gulp.src('js/*.js')
.pipe(jshint())
.pipe(jshint.reporter('default'));
});
// Concatenate & Minify JS
gulp.task('scripts', function() {
return gulp.src('js/*.js')
.pipe(babel({
presets: ['env']
}))
.pipe(concat('all.js'))
.pipe(gulp.dest('dist'))
.pipe(rename('all.min.js'))
.pipe(uglify().on('error', function(e){
console.dir(e);
}))
.pipe(gulp.dest('dist/js'));
});
// Default Task
gulp.task('default', ['lint','scripts']);
app.js(transpiled):
'use strict';
var _cart = require('cart.js'); //Uncaught ReferenceError: require is not defined
var cart = new _cart.Cart();
console.log(cart.getItems());
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var Cart = function () {
function Cart() {
_classCallCheck(this, Cart);
this.cart = [];
this.items = items = [{
id: 1,
name: 'Dove Soap',
price: 39.99
}, {
id: 2,
name: 'Axe Deo',
price: 99.99
}];
}
_createClass(Cart, [{
key: 'getItems',
value: function getItems() {
return this.items;
}
}]);
return Cart;
}();
exports.Cart = Cart;