在没有Webpack的情况下,使用Babel在客户端中进行转换,导入和导出?

nea*_*sic 7 javascript jsx ecmascript-6 reactjs babeljs

我可以使用Babel编译JSX并通过全局命名空间导出变量吗?

我不想运行随机的Webpack服务器.

我已经把我的脑袋包裹在ES6,JSX,Babel和React周围,并且对另一个使这么简单的任务变得复杂的库不太关心

最终我想导出我的React类并导入另一个.从理论上讲,它应该只阻塞,直到满足依赖关系,我不明白这是一个反模式,因为我的所有代码和外部依赖都在本地缓存.

这是<script>标签的默认行为,只是没有<script type="text/babel">

<script type="text/babel">
    var message = "hello world";
</script>

<script type="text/babel">
    console.log(message); // undefined
</script>
Run Code Online (Sandbox Code Playgroud)

我使用ES6导出和导入很好,但不是另一个随机文件服务器

nea*_*sic 1

编辑:显然导出和导入功能已从 Babel 中删除。我不知道为什么,但这与 ES6 合规性和可能的​​安全性有关?

无论如何,如果您决定将它们放入单独的文件中以用于开发目的:

将类放在共享对象(窗口)上

SuperClass.js 必须包含在 SubClass.js 之前

class MySuperClass () {
    constructor (config) {
        super(config);
    }
}

window.MySuperClass = MySuperClass;
Run Code Online (Sandbox Code Playgroud)
var MySuperClass = window.MySuperClass;

class MySubClass extends MySuperClass () {
    constructor (config) {
        super(config);
    }
}
Run Code Online (Sandbox Code Playgroud)

我不确定这是否适用于需要 Babel 一段时间才能转译的非常大的类

到目前为止似乎有效,如果我找到其他解决方案,将会更新