2016-12-21 48 views
0

我有两个.js文件,在同一个文件夹中。实施browserify的困难

app.js:

import {foo} from 'custom'; 
foo(); 

custom.js

function foo(){ 
    $('.nav.navbar-nav > li').on('click', function(e) { 
    $('.nav.navbar-nav > li').removeClass('active'); 
    $(this).addClass('active'); 
    }); 
} 

,我尝试同时在相同的任务使用巴贝尔捆绑他们gulpfile.js。

gulp.task('app-scripts', function() { 
    return gulp.src('src/js/app.js') 
    .pipe(babel({ 
     presets: ["es2015"] 
    })) 
    .pipe(uglify()) 
    .pipe(gulp.dest('build/js')); 
}); 

有人可以帮助我在这个任务中执行browserify?我已经读进来的文件,但不知道如何当我需要它在特定的形式应用它。

试过这个藏汉但没有工作:

const gulp   = require('gulp'); 
    const babelify  = require('babelify'); 
    const browserify  = require('browserify'); 
    const source   = require('vinyl-source-stream'); 
    const buffer   = require('vinyl-buffer'); 
    const sourcemaps  = require('gulp-sourcemaps'); 

    var config = { 
    src:  './src/js/app.js', // тут исходник 
    out:  './build/js/app.js', // тут выходной файл 
    srcmaps: '/build/maps' // sourcemap'ы сохраняться будут сюда же 

    } 

    gulp.task('app-scripts', function() { 
    const bundler = browserify(config.src, {debug: true}) 
    .transform('babelify', {presets: ['es2015']}) 

return bundler.bundle() 
    .pipe(source(config.out)) 
    .pipe(buffer()) 
    .pipe(sourcemaps.init()) 
    .pipe(sourcemaps.write(config.srcmaps, {addComment: false})) 
    .pipe(gulp.dest('./build/js')); 
    }); 

回答

0

出于某种原因,方法上面列出,这是从文档没有工作, 但这种方法非常完美,这是藏汉从文档:

gulp.task('app-scripts', function() { 
const bundler = browserify('./src/js/app.js', {debug: true}) 
    .transform(babelify.configure({presets: ["es2015"]})); 

return bundler.bundle() 
    .pipe(source('app.min.js')) 
    .pipe(buffer()) 
    .pipe(uglify()) 
    .pipe(sourcemaps.init()) 
    .pipe(sourcemaps.write('./', {addComment: false})) 
    .pipe(gulp.dest('./build/js')); 
});