无法使用 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 class:

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',
})

无法使用 require 加载 ES6 模块

Can't load ES6 module with require

browserify

ecmascript-6

es6-module-loader