2016-06-23 41 views
3

我使用以下gulp.js文件使用一飲而盡,巴貝爾給未捕獲的ReferenceError:要求沒有定義

var gulp = require('gulp'); 
var babel = require('gulp-babel'); 

gulp.task('bundle', bundle); 

function bundle() { 
    gulp.src('./src/*.jsx') 
    .pipe(babel()) 
    .pipe(gulp.dest('./dist')); 
} 

gulp.task('build', ['bundle']); 

transpile 「main.jsx」 內容

import React from 'react'; 

Transpile之後之前,「 js「文件生成的dist文件夾中,需要('')

var _react = require('react'); 

while request for the page index.html

<body> 

    <div id="app" ></div> 
    <script src="main.js"></script> 

</body> 

未捕獲的ReferenceError:要求未定義顯示在控制檯中。

我知道構建任務有問題,但我無法弄清楚。

回答

3

在瀏覽器中,您不能使用require API,所以你需要以某種方式捆綁你的代碼,你有幾種選擇:

  • Browserify
  • 的WebPack
  • 彙總

這些模塊捆綁器允許您指定一個「入口」點,然後將所有必需的模塊捆綁在一個文件中。

回答此問題的類似問題: Gulp + babelify + browserify issue

相關問題