ecmascript 6 - Polymer: Gulp build transpile + bundle -
i'm struggling working custom build polymer using gulp. goal polymer 1 project written in es6 transpiled & bundled. followed guide https://github.com/polymerelements/generator-polymer-init-custom-build.
the transpilation works single files, bundled js code untranspiled (as written in es6). here gulp task :
function build() { return new promise((resolve, reject) => { // eslint-disable-line no-unused-vars // okay, first thing clear build directory console.log(`deleting ${builddirectory} directory...`); del([builddirectory]) .then(() => { // okay, let's source files let sourcesstream = polymerproject.sources() // here's how splithtml & gulpif work .pipe(polymerproject.splithtml()) // transpile .pipe($.sourcemaps.init()) .pipe($.if('*.js', $.babel({ presets: ['es2015'] }))) .pipe($.sourcemaps.write()) // oh, want minify stuff? go it! .pipe(gulpif(/\.js$/, uglify())) .pipe(gulpif(/\.html$/, htmlminifier())) .pipe(gulpif(/\.(png|gif|jpg|svg)$/, imagemin())) .pipe(polymerproject.rejoinhtml()); // okay, let's same dependencies let dependenciesstream = polymerproject.dependencies() // .pipe(polymerproject.bundler) .pipe(polymerproject.splithtml()) .pipe(gulpif(/\.js$/, uglify())) .pipe(gulpif(/\.html$/, htmlminifier())) .pipe(polymerproject.rejoinhtml()); // okay, let's merge them single build stream let buildstream = mergestream(sourcesstream, dependenciesstream) .once('data', () => { console.log('analyzing build dependencies...'); }); // #problem# -> included sources won't transpiled buildstream = buildstream.pipe(polymerproject.bundler); // okay, time pipe build directory buildstream = buildstream.pipe(gulp.dest(builddirectory)); // waitfor buildstream complete return waitfor(buildstream); }) .then(() => { // okay, let's generate service worker console.log('generating service worker...'); return polymerbuild.addserviceworker({ project: polymerproject, buildroot: builddirectory, bundled: true, swprecacheconfig: swprecacheconfig }); }) .then(() => { // did it! console.log('build complete!'); resolve(); }); }); } gulp.task('build', build);
thank help.
Comments
Post a Comment