Use ES6 modules instead of AMD

[Reinmar]

The discussion was started in ckeditor/ckeditor5-design#73 whether we shouldn't use ES6 modules rather than AMD. So far the discussion is not concluded, but there were three reasons why we started investigating using ES6 modules:

• getting rid of hacks that we had to make AMD work,
• ability to easily run the code in Node.JS (we used couple of hacks to adjust AMD to our needs, but these hacks were problematic when porting the code to different envs),
• circular dependencies which with ES6 modules deal easily, but which were constant problem in the complex OT world (sure, you can always solve this by making architectural changes, but we've seen that these changes make the code worse, not better).

I'll conclude my research later on, because I found it very interesting (and not straightforward).

The plan for now is to use Babel to transpile ES6 modules to AMD (for browsers) or CJS (for Node) in a way which will also allow to use ES6 modules natively in the future.

[Reinmar]

I've been talking with PJ that we definitely need to start transpiling all the code (so including tests and test tools), because:

• we will not be able to run tests on older browsers (we use ES6 features in the tests),
• there's huge mess when part of the code is ES6 modules transpiled to AMD and the rest is clear AMD or even plain JS files.

As a second stage of this ticket we will add tests to the current pipeline.

[Reinmar]

Notes for me (I'll explain them later if I decide to go for this):

/dist
    /amd
        /ckeditor5
            /core
                /ui
                    view.js
                editor.js
            /classic-creator
                classiccreator.js
            load.js
        ckeditor.js

        /tests
            /_lib
                sinon.js
            /_tools
                tools.js
            /core
                /_tools
                    tools.js
                editor.js
                tests-tools.js
            /classic-creator
                /_tools
                    tools.js
                classiccreator.js
                tests-tools.js
            load.js
            tests-tools.js

/dist
    /amd
        ckeditor.js



## /tests/core/foo.js

import CKEditor from 'ckeditor5/ckeditor.js';
import load from 'ckeditor5/core/load.js';

...

## ckeditor.js

define( 'ckeditor5/core/editor.js', [ '../../ckeditor5/ckeditor.js' ], ... )

## index.html

require( 'ckeditor.js', ( CKEDITOR ) => {
    require( 'ckeditor5/core/editor.js', () => {

    } );
} );

[Reinmar]

It seems that I managed to transform the code into a set of ES6 modules with Gulp+Babel taking care of transpilation. Unfortunately, couple of things didn't work due to issues in other libraries:

• Following symlinks does not work when matched against sth* pattern paulmillr/chokidar#419 – watching symlinks is broken, so for now we'll be forced to rebuild the code manually. Pretty irritating so I'll work on this in the next step.
• https://phabricator.babeljs.io/T6880 – AMD modules generated by Babel have serious issues with circular dependencies... which is a huge disappointment because ES6 modules were supposed to solve these kind of issues. Unfortunately, for the time being we'll need to use a patched version of Require.JS.

Other than that, architecturally, there is one more step to do – transforming tests to ES6 modules as well. Without that we'll have multiple problems when referencing dev code in the tests and tests tools. I encounter serious issues when I wanted to load e.g. a piece of dev code in a test tool. Plus, we must make the test work in non-fully-ES6-compatible browsers anyway. So this will be an important step as well. Most likely I'll work on this right after fixing the watcher.

And the last step – documentation. I made a huge amount of changes in the code, changed some concepts and made some decision based on the previous research. All this needs to be transformed into docs. Otherwise, in a couple of weeks we will start making the same mistakes which I did along the road :D.