Use Babel to transpile, import and export in the client, without Webpack?

Question

Can I use Babel to compile JSX and export vars through the global namespace?

I don't want to run a random Webpack server.

I'm already wrapping my head around ES6, JSX, Babel, and React, and couldn't care less about another library that complicates such a simple task

Ultimately I would like to export my React class and import in another. Theoretically, it should only block until the dependencies are met, and I don't understand how this could be an anti-pattern, since all of my code and external dependencies are cached locally.

This is default behavior for <script> tags, just not <script type="text/babel">

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

<script type="text/babel">
    console.log(message); // undefined
</script>

I'm fine with using ES6 export and import, but not another random file server

Answer 1

EDIT: Apparently export and import functionality was removed from Babel. I'm not sure why, but it has to do with ES6 compliance and possibly security?

Anyways, if you're determined to put them in separate files for dev purposes:

Put the class on a shared object (window)

SuperClass.js must be included before SubClass.js

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

window.MySuperClass = MySuperClass;

---

var MySuperClass = window.MySuperClass;

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

I'm not sure if this works for very large classes that take Babel a while to transpile

It seems to work so far, will update if I find another solution