Question

我正在使用React和ES6撰写JSX个应用程序。以下是我用来将.es6文件浏览为bundle.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')));

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

1 个答案: