javascript - gulp browserify 怎么编译html中的es6-PHP中文网问答

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>rxjs</title>
    <script src="../js/jquery/jquery-3.1.0.js"></script>
</head>
<body>
<input id="text"/>
<p id="result"></p>
<script>
    import Rx from 'rxjs/Rx';

    const Observable = Rx.Observable

    const input = document.querySelector('input')

    const search$ = Observable.fromEvent(input, 'input')
        .map(e => e.target.value)
        .filter(value => value.length >= 1)
        .throttleTime(1000)
        .distinctUntilChanged()
        .switchMap(term => Observable.fromPromise(wikiIt(term)))
        .subscribe(
            x => renderSearchResult(x),
            err => console.error(err)
        )

    function renderSearchResult(result) {
        document.querySelector('#result').innerHTML = result[1]
            .map(r => `<li>${r}</li>`)
            .join('')
    }

    function wikiIt(term) {
        var url = 'http://en.wikipedia.org/w/api.php?action=opensearch&format=json&search=' + encodeURIComponent(term) + '&origin=*';
        return $.getJSON(url)
    }


</script>
</body>
</html>

/**
 * gulpfile.js
 */
var gulp = require('gulp');
var sourcemaps = require('gulp-sourcemaps');
var source = require('vinyl-source-stream');
var buffer = require('vinyl-buffer');
var browserify = require('browserify');
var watchify = require('watchify');
var babel = require('babelify');
var uglify = require('gulp-uglify');

gulp.task('build', function () {
    var bundler = watchify(browserify('./rx.js', {debug: true}).transform(babel));

    bundler.bundle()
        .on('error', function (err) {
            console.error(err);
            this.emit('end');
        })
        .pipe(source('build.js'))
        .pipe(buffer())
        // .pipe(uglify())
        .pipe(sourcemaps.init({loadMaps: true}))
        .pipe(sourcemaps.write('./'))
        .pipe(gulp.dest('./build'));
});

gulp.task('watch', function () {
    gulp.watch('./**/*.js', ['build']);
})

gulp.task('default', ['build', 'watch']);