Loading CodeMirror mit RequireJS von CDN

Question

Ich möchte eine Online-Javascript-Demo machen und ich möchte Benutzern erlauben, Demo-Verhalten durch Ändern des Codes zu ändern. Mein Projekt verwendet RequireJS mit großem Erfolg, also habe ich beschlossen, dabei zu bleiben. Zuerst versuchte ich Editor durch absolute URL-Pfade zu laden:

require(
    [ 
     "//cdnjs.cloudflare.com/ajax/libs/codemirror/5.13.4/codemirror.js", 
     "//cdnjs.cloudflare.com/ajax/libs/codemirror/5.13.4/mode/javascript/javascript.js", 
     "//cdnjs.cloudflare.com/ajax/libs/codemirror/5.13.4/addon/comment/continuecomment.js", 
     "//cdnjs.cloudflare.com/ajax/libs/codemirror/5.13.4/addon/edit/matchbrackets.js", 
     "//cdnjs.cloudflare.com/ajax/libs/codemirror/5.13.4/addon/comment/comment.js" 
    ], 
    (CodeMirror)=>{ 
     var editor = CodeMirror.fromTextArea(document.getElementById("code"), { 
      lineNumbers: true, 
      matchBrackets: true, 
      continueComments: "Enter", 
      extraKeys: {"Ctrl-Q": "toggleComment"} 
     }); 
    } 
); 

Erfordern JS versucht, diesen Weg zu laden dann: http://cdnjs.cloudflare.com/ajax/libs/codemirror/5.13.4/lib/codemirror Das ist offensichtlich falsch, weil

1. ich es nicht fragen stellen /lib/ vor mein Weg, warum also?
2. .js fehlt.

Nach diesem Scheitern habe ich versucht, requireJS zu konfigurieren und relative Pfade verwenden:

requirejs.config({ 
    paths: { 
     codemirror: [ 
      "//cdnjs.cloudflare.com/ajax/libs/codemirror/5.13.4/" 
     ] 
    }, 
    waitSeconds: 20 
}); 

require(
    [ 
     "codemirror/codemirror", 
     "codemirror/mode/javascript/javascript", 
     "codemirror/addon/comment/continuecomment", 
     "codemirror/addon/edit/matchbrackets", 
     "codemirror/addon/comment/comment" 
    ], 
    (CodeMirror)=>{ 
     var editor = CodeMirror.fromTextArea(document.getElementById("code"), { 
      lineNumbers: true, 
      matchBrackets: true, 
      continueComments: "Enter", 
      extraKeys: {"Ctrl-Q": "toggleComment"} 
     }); 
    } 
); 

Diesmal ist .js da, aber der Weg ist immer noch falsch: http://cdnjs.cloudflare.com/ajax/libs/codemirror/5.13.4//lib/codemirror.js Beachten Sie den doppelten Schrägstrich.

Ich habe RequireJS nicht gebeten, zufällige Sachen in den angegebenen Pfad zu legen, also warum tut es das? Wie kann ich das schaffen?

Answer 1

Das Problem ist, dass Codemirror normalerweise so verpackt ist, dass die codemirror.js Datei im Verzeichnis /lib ist jedoch so, wie es auf cdnjs gehostet wird ist, dass es im Stammverzeichnis ist. Ihr Problem tritt dann auf, wenn Sie versuchen, ein Add-On zu laden, das dann versucht, ../../lib/codemirror zu laden, das wegen des oben genannten Hosting-Unterschieds nicht vorhanden ist.

bekam ich es mit so etwas wie dies funktioniert:

requirejs.config({paths:{ 
    codemirror:'https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.14.2', 
    'codemirror/lib':'https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.14.2'} 
}); 
requirejs(["codemirror/lib/codemirror", "codemirror/addon/comment/continuecomment"], 
function(CodeMirror) { 
});