Устранение ошибки конфликта библиотеки CodeMirror «Uncaught TypeError: CodeMirror не является функцией» в WordPress - PullRequest
0 голосов
/ 29 февраля 2020

Я поддерживаю плагин, который использует библиотеку CodeMirror на панели администратора. Некоторые пользователи жалуются на «Uncaught TypeError: CodeMirror не является функцией», которая возникает из-за конфликта в версиях CodeMirror. Мой плагин использует CodeMirror 2 (v5.x), который я создаю с помощью пользовательского файла сценария после загрузки библиотеки,

(function($){
  $(document).ready(function(){
    var options = {};
    var cmEditor = CodeMirror($('#cmeditor').get(0), options); //error thrown here.
    ...
  }
})(jQuery)

Однако, более старый Codemirror 1 требовал, чтобы новый объект был экземпляр, var cmEditor = new CodeMirror();, и именно здесь возникает конфликт. Если другие плагины проверяют CodeMirror 1 и не нацеливаются на страницы администратора должным образом (обычная проблема с плохо закодированными плагинами), то мой плагин пытается создать экземпляр редактора, используя более старую версию библиотеки, которая загружается последней.

Так как один гарантирует, что скрипт использует правильную библиотеку?

1 Ответ

0 голосов
/ 29 февраля 2020

После некоторого поиска общего решения для javascript управления конфликтами библиотек, я наткнулся на этот блог post о том, как загрузить и использовать различные версии jQuery в WordPress и этот ответ в StackOverflow, который использует конструкцию анонимной функции для передачи объекта, созданного сразу после загрузки необходимой библиотеки. Так что мне удалось решить мою проблему с помощью функции wp_add_inline_script() в WordPress.

wp_enqueue_script('codemirror-js', 'uri_path_to_js_folder/codemirror.js', null, '5.32');
wp_add_inline_script( 'codemirror-js', 'var cme_5_32 = CodeMirror(document.getelementById("cmeditor"),{});'

это обеспечит создание экземпляра объекта cme_5_32 сразу после того, как библиотека CodeMirror v5.32 загружен браузером и, следовательно, использует правильную библиотеку.

Затем я анализирую этот объект как атрибут анонимной функции моего скрипта,

(function($, cme){
  $(document).ready(function(){
    ...
  }
})(jQuery, cme_5_32)

и теперь больше нет ошибки!

...