CodeMirror 6 distribution package

v6
1

Hi there,

I’m looking for a copy of CodeMirror 6 that doesn’t have to be installed from npm. I’m not using a bundle system. I just need a file that i can include in my HTML page.

Thanks.

1 Like
2

That is not something I provide. You’ll have to learn enough npm and node to build it yourself, I’d say. Which has the added advantage that you can include precisely what you need, since a one-size-fits-all blob file would have to include every feature and language mode and be huge.

3

I’m not asking for a full package. I’m asking for a distribution package with everything browser-ready.

With CM5 I could load the parts I wanted with script tags and pass the DOM element to build from into the CodeMirror object constructor.

With CM6, it appears that you have removed the ability to have code like I sample below.

You have severely diminished the developer experience. This is a huge step backward. Your documentation doesn’t even have a start-to-finish example of making an editor. Your “Examples” section has some code snippets, but all the code is out of context and you don’t explain how it fits into the whole.

I am a senior developer and I understand NPM, but I am also a business owner. I don’t have the time or money to re-create boilerplate that you removed.

By your current development path, I have to create a new editor component and make new bundle for every editor I wanted to have in my client’s site. This will have me end up with several huge bundles, instead of mix-and-match pieces, like in CM5.

I want to import CM into the project I’m working on. You want me to have to create several new and separate projects to make code editor components for my first project.

I also want to be able to pass a DOM element to a constructor, but your examples have a <script module="..."></script> tag being placed where the code editor shows up, instead of having an empty DOM element to be passed to the constructor later.

I need this to be available for CM6:

<script src="js/codemirror-5.65.13/lib/codemirror.js"></script>
<script src="js/codemirror-5.65.13/addon/hint/show-hint.js"></script>
<script src="js/codemirror-5.65.13/addon/hint/xml-hint.js"></script>
<script src="js/codemirror-5.65.13/addon/hint/html-hint.js"></script>
<script src="js/codemirror-5.65.13/addon/fold/xml-fold.js"></script>
<script src="js/codemirror-5.65.13/addon/edit/closetag.js"></script>
<script src="js/codemirror-5.65.13/addon/edit/matchtags.js"></script>
<script src="js/codemirror-5.65.13/mode/xml/xml.js"></script>
<script src="js/codemirror-5.65.13/mode/javascript/javascript.js"></script>
<script src="js/codemirror-5.65.13/mode/css/css.js"></script>
<script src="js/codemirror-5.65.13/mode/htmlmixed/htmlmixed.js"></script>
<script>
    window.onload = function () {
        editor = CodeMirror(document.getElementById("code"), {
            mode: "htmlmixed",
            lineNumbers: true,
            extraKeys: {"Ctrl-Space": "autocomplete"},
            tabSize: 4,
            indentWithTabs: false,
            autoCloseTags: true,
        });
    };
</script>

You’re basically saying that I need to finish your development process by compiling your modules myself so that I can get a sane experience.

CM5 was a full-featured editor. It was a full drop-in product.

CM6 is an ugly mess of blocks strewn across the floor for the adults to pick up and organize to get back to being the product that it once was.

You can no longer say that CM is a code editor. It’s a kids mess on the floor.

4

I don’t get the problem (and I think the harsh tone is really uncalled for).
All you have to do is put your setup code in a module and then you can import that module every time instead of duplicating everything for every page. I don’t think this would be that many more lines of codes than you have here.
The fact that cm6 now uses script modules is also clearly an improvement.
If you don’t want to deal with npm, you can even use a service like jspm.dev. That’s what I do and it works great.

1 Like