Babelify在导入时省略文件扩展名

Question

我正在用ES6和JSX编写一个React应用程序.下面是我用来浏览我的文件的命令..es6bundle.js

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

当我尝试使用类似的东西导入组件时import MenuBar from './menu',我收到错误消息:

Error: Cannot find module './menu'

我找到的唯一解决方法是添加.es6文件名(import MenuBar from './menu.es6'),这看起来不太吸引人.

有没有办法让browserify或babelify知道导入模块时使用的扩展？

Answer 1

尝试:

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

Babelify应该.es6默认处理它的结尾.

顺便说一下,如果你能够更好地针对browserify API编写脚本而不是使用CLI.在这种情况下它会是这样的:

var
  browserify = require('browserify'),
  babelify = require('babelify'),
  path = require('path'),
  fs = require('fs');

browserify('src/es6/app.es6', {
  extensions: ['.js', '.json', '.es6'],
})
  .transform(babelify)
  .bundle()
  .pipe(fs.createWriteStream(path.join(__dirname, 'build/js/bundle.js')));