如何从browserify/babelify导出全局变量，以便在没有browserfy的情况下在项目中使用

How to export global variable from browserify/babelify to be used in project without browserify?

本文关键字：browserfy 情况下 项目 browserify babelify 全局变量      更新时间：2023-09-26

场景：

我有两个项目有完全不同的设置：

  1. 常规网站，带有简单gump设置的遗留代码

  2. 小型宠物项目。JS滑块插件是在ES6类的帮助下编写的(用babel编译(。JS吞咽任务：

    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

还有其他想法吗？

设置standalone选项：

当opts.standalone是非空字符串时，将使用该名称和umd包装器创建一个独立模块。可以在独立全局导出中使用命名空间，使用字符串名称中的.作为分隔符，例如'A.B.C'。全球出口产品将进行消毒和骆驼包装。

相关文章：