gulp-bro에서 .jsx로 끝나는 파일을 가져 오려면 어떻게해야합니까?

Question

gulp와 gulp-bro를 사용하여 jsx를 transpile하려고 시도하고 있습니다. 가져 오기 끝에 .jsx를 추가하지 않으면 구성 요소를 가져올 수 없다는 것을 제외하고는 거의 다 있습니다.

import Viewer from './components/viewer/Viewer'; 

는 Error: Cannot find module './components/viewer/Viewer'

동안 실패 :이처럼

import Viewer from './components/viewer/Viewer.jsx'; 

작품 벌금을!

물론 가져 오기 트리는 이보다 더 복잡합니다. 따라서 피할 수 있으면 .js 또는 .jsx를 명시 적으로 지정하지 않는 것이 좋습니다.

다음은 내 gulpfile의 관련 섹션입니다. 확장 설정을 무시합니다.

gulp.task('viewer', function() { 
    gulp.src('./app/js/app.jsx') 
    .pipe(bro({ 
     transform: [ 
      babelify.configure({ 
      presets: ['env', 'react'], 
      }) 
     ], 
     extensions: ['js', 'jsx'], 
     debug: true, 
    })) 
    .pipe(rename('app.js')) 
    .pipe(gulp.dest(paths.js)) 
}); 

Answer 1

Gulp-bro은 browserify에 옵션을 전달합니다. 확장의 옵션에 대한 browserify의 문서가 좋은 것은 아니지만, 나는 How to specify browserify extensions in package.json? 및 Grunt-Browserify extensions flag not working가 어디 확장 옵션이 포함되어야합니다 "."의

그것은 확장과 같은

extensions: ['.js', '.jsx'],