Module Can'；t使ES6模块中的对象导入与Gulp、Browserify和Babelify一起工作

我真的很喜欢ES6模块，但我很难让它们完全与Browserify和增强的对象文字一起工作

我创建了一个简化的测试用例来总结我的问题

这是gulpfile：

var gulp = require('gulp');
var babelify = require('babelify');
var browserify = require('browserify');
var buffer = require('vinyl-buffer');
var source = require('vinyl-source-stream');

gulp.task('scripts', function() {
  var b = browserify({
    entries: 'main.js',
    debug: true
  })
  .transform(babelify)

  return b.bundle()
  .pipe(source('bundle.js'))
  .pipe(buffer())
  .pipe(gulp.dest('./'));
});

gulp.task('default', ['scripts']);

它的目标是使用Browserify和transpile ES6将ES6模块转换为ES5

现在，我对基本导入没有问题，但是我不能让它与对象导入一起工作。假设我有两个文件：

utils.js

let utils = {
  sayHi() {
    console.log('hi');
  }
}

main.js

import utils from './utils';

utils.sayHi();

这将触发一个错误：

uncaughttypeerror:\u utils2.default.sayHi不是一个函数

在这一点上，我找不到任何像样的解决办法。任何帮助都将不胜感激

试试这个：

// utils.js
export default utils = { ... }

// main.js
import utils from './utils';

utils.sayHi();

如果未将UTIL导出为默认值，则必须将导入更改为：

import { utils } from './utils';

试试这个：

// utils.js
export default utils = { ... }

// main.js
import utils from './utils';

utils.sayHi();

如果未将UTIL导出为默认值，则必须将导入更改为：

import { utils } from './utils';

---

您没有从utils.js导出任何内容，因此无法导入任何内容

如果希望能够按写入方式导入对象，则必须将其设置为默认导出：

---

您没有从utils.js导出任何内容，因此无法导入任何内容

如果希望能够按写入方式导入对象，则必须将其设置为默认导出：

---

谢谢，我已经完全忘记了还必须导出模块。工作起来很有魅力：）谢谢，我已经完全忘记了还必须导出模块。工作原理类似于咒语：）请记住，像这样导出对象被视为反模式，最好使用命名导出<代码>导出函数sayHi（）{}和

从“/utils”作为utils导入*。请记住，像这样导出对象被视为反模式，最好使用命名导出<代码>导出函数sayHi（）{}

和

从“/utils”作为utils导入*。