无法使用 require 加载 ES6 模块

Question

我正在使用 gulp + browserify 将 es6 编译为 es5，然后尝试在另一个模块中 require （这些都不起作用）：

Main = require('mylibrary/dist/main').Main
Main2 = require('mylibrary/dist/main')

还尝试了export default class Main 并尝试了class Main 然后export default new Main

我确定这是我想念的简单东西？

es6 类：

export class Main {
  constructor(){
    console.log('Main!');
  }

  test(){
    console.log('test');
  }
}

输出（缩写）：

var Main = exports.Main = function () {
  function Main() {
    _classCallCheck(this, Main);

    console.log('Main!');
  }

  _createClass(Main, [{
    key: 'test',
    value: function test() {
      console.log('test');
    }
  }]);

  return Main;
}();

gulpfile.js

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

gulp.task('browserify', function() {
    return browserify({
        entries: ['src/main.js'],
        debug: true
    })
  .transform(babelify, {presets: ["es2015", "react"]})
    .bundle()
  .on("error", function (err) { console.log("Error : " + err.message); })
    .pipe(source('main.js'))
    .pipe(gulp.dest('./dist'));
});

gulp.task('watch', function() {
    gulp.watch('src/*.js', ['browserify']);
    gulp.watch('src/*.jsx', ['browserify']);
});

gulp.task('default', ['watch','browserify']);

Answer 1

默认情况下，Browserify 构建一个用于在浏览器中运行的文件，而不是用于与require 一起工作的文件。您想通过

使用 Browserify 的 standalone 选项

return browserify({
    entries: ['src/main.js'],
    debug: true,
    standalone: 'someName',
})