javascript - 如何从 browserify/babelify 导出全局变量以便在没有 browserify 的项目中使用？

Question

场景:

我有 2 个项目，其设置完全不同:

1. 常规网站、遗留代码以及简单的 gulp 设置

2. 小型宠物项目。在 ES6 类的帮助下编写的 JS slider 插件(用 babel 转译)。 JS gulp 任务:

   gulp.task('js', function() {
   return gulp.src('src/scripts/*.js')
   .pipe($.plumber())
   .pipe(through2.obj(function (file, enc, next) {
       browserify(file.path, { debug: true })
       .transform(require('babelify'))
       .transform(require('debowerify'))
       .bundle(function (err, res) {
           if (err) { return next(err); }
           file.contents = res;
           next(null, file);
       });
   }))
   .on('error', function (error) {
       console.log(error.stack);
       this.emit('end')
   })
   .pipe( $.rename('alder.js'))
   .pipe( gulp.dest('dist/scripts/'));
   

   });

我想要实现什么？

我希望能够在这个常规网站中使用 browserify/babelify 输出的文件(无需设置整个 browserify/babelify 的东西)。

问题

当然，browserify/babelify 做了一些神奇的事情，最后将变量包装到函数作用域中，隐藏了这个变量/构造函数。所以问题是导出可在其他项目中使用的全局变量/构造函数的正确方法是什么？此时，我想到的唯一一件事是将我的函数附加到窗口对象，例如:

    class Alder { // constructor and then methods }
    export default Alder;
    window['Alder'] = Alder

还有其他想法吗？

Answer 1

设置独立选项:

When opts.standalone is a non-empty string, a standalone module is created with that name and a umd wrapper. You can use namespaces in the standalone global export using a . in the string name as a separator, for example 'A.B.C'. The global export will be sanitized and camel cased.