gulp-babel編譯es6后的require怎么處理嚎尤？
Babel 所做的只是幫你把‘ES6 模塊化語法’轉(zhuǎn)化為‘CommonJS?模塊化語法’，其中的require?exports?等是 CommonJS 在具體實現(xiàn)中所提供的變量。
任何實現(xiàn) CommonJS 規(guī)范的環(huán)境（如 node 環(huán)境）可以直接運行這樣的代碼，而瀏覽器環(huán)境并沒有實現(xiàn)對 CommonJS 規(guī)范的支持窄俏，所以我們需要使用打包工具（bundler）來進行打包，說的直觀一點就是把所有的模塊組裝起來蜗细，形成一個常規(guī)的 js 文件裆操。
常用的打包工具包括 browserify webpack rollup 等怒详。
例如：
//es6 to js,開發(fā)環(huán)境炉媒，可以相對友好的跟錯誤
gulp.task('react-es6-dev', function () {
? ? gulp.src(['./src/**/*.jsx', './src/**/*.js'])
? ? ? ? //.pipe(browserify({
? ? ? ? // transform:['babelify','reactify']
? ? ? ? //}))//compile JSX (superset of javascript used in react UI library) files to javascript
? ? ? ? .pipe(react({ es6module: true }))//這里就是新加入的模塊, 解析jsx用
? ? ? ? .pipe(babel({ presets: [es2015, stage0], babelrc: false }))//es6tojs的解析器
? ? ? ? .pipe(gulp.dest('dist'))
? ? ? ? .pipe(webpack({
? ? ? ? ? ? //babel編譯import會轉(zhuǎn)成require，webpack再包裝以下代碼讓代碼里支持require
? ? ? ? ? ? devtool: 'cheap-module-source-map',
? ? ? ? ? ? output: {
? ? ? ? ? ? ? ? filename: "index.js",
? ? ? ? ? ? },
? ? ? ? ? ? stats: {
? ? ? ? ? ? ? ? colors: true
? ? ? ? ? ? },
? ? ? ? }))
? ? ? ? .pipe(gulp.dest('./dist/build'))
});
