2015-05-15 26 views
9

Kaynak kodumu ES6 + JSX'den düz Javascript'e derlemek için Gulp, Browserify ve Babelify kullanıyorum.Babelify sourceType hatası, programlanabilir olarak kullanıldığında

Benim gulpfile.js benziyor: benim app.es6 ait

var gulp = require('gulp') 
var fs = require("fs") 
var browserify = require("browserify") 
var babelify = require("babelify") 

gulp.task('es6',function(){ 
    return browserify({ debug: true }) 
    .transform(babelify.configure({ 
     extensions: ['.es6'] 
    })) 
    .require("./src/es6/app.es6", { entry: true }) 
    .bundle() 
    .on("error", function (err) { console.log("Error : " + err.message); }) 
    .pipe(fs.createWriteStream("./build/js/bundle.js")) 
}) 

ilk hatları geçerli:

"use strict" 

import React from 'react' 
import MenuBar from './menu' 

Ben $ gulp es6 çalıştırın aşağıdaki hatayı alıyorum: Ancak

Error : 'import' and 'export' may appear only with 'sourceType: module' 

Browserify'in kısayolunu kullandığımda bu olmaz:

$ browserify src/es6/app.es6 -t babelify -o build/js/bundle.js --extension=.es6 

Bu sorunun nasıl çözüleceğine dair herhangi bir düşünce var mı?

cevap

4

extensions:['.es6'] seçenek ile konfigürasyonları en browserify ilave edilmesi gerekmektedir:

browserify({ debug: true, extensions: ['.js', '.json', '.es6'] }) 

tüm gulpfile bu gibi görünmelidir:

var gulp = require('gulp') 
var fs = require("fs") 
var browserify = require("browserify") 
var babelify = require("babelify") 

gulp.task('es6',function(){ 
    var extensions = ['.js','.json','.es6']; 
    return browserify({ debug: true, extensions:extensions }) 
    .transform(babelify.configure({ 
     extensions: extensions 
    })) 
    .require("./src/es6/app.es6", { entry: true }) 
    .bundle() 
    .on("error", function (err) { console.log("Error : " + err.message); }) 
    .pipe(fs.createWriteStream("./build/js/bundle.js")) 
})