使用RequireJS包含使用ES6语法定义的类

Emm*_*son 3 javascript requirejs ecmascript-6

我有一个现有项目(在浏览器中完全运行,没有服务器端组件),它使用RequireJS来管理依赖项.以前我定义"类"(包括继承)的方式是这样的:

define([
    'jquery',
    'classes/SomeParentClass',
], function($, SomeParentClass){

    function ThisClass(data){

        SomeParentClass.call(this, data);

        this.init = function(data){
            //Do stuff
        }

        this.init(data);
    }

    ThisClass.prototype = Object.create(SomeParentClass.prototype);
    ThisClass.prototype.constructor = ThisClass;

    return ThisClass;

});
Run Code Online (Sandbox Code Playgroud)

然后,当我想将它包含在其他类中时,我会使用标准的RequireJS define/require语法:

define(['classes/ThisClass'], function(ThisClass){
    var fooInstance = new ThisClass(fooData);
});
Run Code Online (Sandbox Code Playgroud)

我想尝试一下ES6中的"class"语法,所以我开始转换我现有的一个类(为了简单起见,我开始使用"静态"类).它目前看起来像这样:

define([
    'jquery',
], function($){

    class SomeClass {

        static someStaticFn(){
            //Do whatever
        }
    }

});
Run Code Online (Sandbox Code Playgroud)

我目前陷入困境的是如何使用RequireJS引用SomeClass(使用新的ES6语法).假设甚至可能.

UPDATE

正如其他人在下面指出的那样,返回课程是RequireJS所关心的.我本可以发誓我已经尝试过了,但果然它确实奏效了.

如果其他人像我这样的假人并在类似的情况下到此结束,我想也指出我确实在requirejs-babel插件上取得了一些成功,但是只有我重新编写我的课程以使用ES6之后导出导入语句而不是RequireJS的定义.完成之后,我在其他地方包括课程,我必须这样做:

define(['es6!ThisClass'], function(ThisClass){ ...
Run Code Online (Sandbox Code Playgroud)

我最终选择修改每个其他模块中包含的类,所以添加所有这些"es6!" 字符串结果是拖累.虽然这篇关于将现有项目移植到ES6的文章提到了一种通过RequireJS配置自动化该过程的方法.

但是,由于requirejs-babel在运行时转换了ES6代码,我此时可能不会将其合并到我的项目中.如果我确定我想用ES6全力以赴,我可能会使用"常规" Babel或者可能使用TypeScript

Men*_*ngo 9

ES6 Class只是一个糖衣,下面仍然有相同的实现.您可以使用旧方法按功能创建类.还要小心浏览器兼容性https://kangax.github.io/compat-table/es6/.

define([
    'jquery',
], function($){

    return class SomeClass {

        static someStaticFn(){
            //Do whatever
        }
    }

});
Run Code Online (Sandbox Code Playgroud)