Continuing the discussion from Using es6 version of main.js:
Hey folks, I have JavaScript files making use of import
, require
, and export
statements that i’d like to compile with Babel and include in the Sage 8 asset-builder.
The file that needs compiling is declared in manifest.json rather than being included in main.js.
...
},
"city.js": {
"files": [
"scripts/routes/city.js"
]
}
...
I’ve gotten as far as installing gulp-babel
and making the necessary changes to gulp.js
though the imports look strange. i.e…
import CityPageModel from '../models/City'
compiles to:
var _City = require('../models/City');
Not sure if this an issue with the asset path or the compiler but shouldn’t this statement pull in the file contents and compile everything together into the importing file just like main.js
?
Here’s a portion of my gulp file:
var filter = require('gulp-filter');
var babel = require("gulp-babel");
....
var jsTasks = function(filename) {
var f = filter(project.js, {restore: true});
return lazypipe()
.pipe(function() {
return gulpif(enabled.maps, sourcemaps.init());
})
.pipe(function() {
return f;
})
.pipe(function() {
return babel({ presets: ['es2015'] });
})
.pipe(function() {
return f.restore;
})
.pipe(concat, filename)
// .pipe(uglify, {
// compress: {
// 'drop_debugger': enabled.stripJSDebug
// }
// })
.pipe(function() {
return gulpif(enabled.rev, rev());
})
.pipe(function() {
return gulpif(enabled.maps, sourcemaps.write('.', {
sourceRoot: 'assets/scripts/'
}));
})();
};
The help is appreciated!