`serie: true` не может обеспечить порядок загрузки модулей - PullRequest
0 голосов
/ 25 апреля 2018

Я хочу загрузить CodeMirror на ocLazyLoad.Поскольку xml.min.js, htmlmixed.min.js, css.min.js и т. Д., Все должны codemirror.min.js быть загруженными перед ними.Я пытаюсь использовать serie: true, чтобы убедиться, что порядок загрузки:

$ocLazyLoadProvider.config({
    debug: true,
    serie: true,
    modules: [{ 
        name : 'codeMirror1', 
        files: [
            "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/codemirror.min.css",
            "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/codemirror.min.js"
    ]},{
        name : 'codeMirror2',
        files: [
            "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/mode/xml/xml.min.js",
            "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/mode/htmlmixed/htmlmixed.min.js",
            "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/mode/css/css.min.js",
            "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/mode/javascript/javascript.min.js",
            "https://cdnjs.cloudflare.com/ajax/libs/angular-ui-codemirror/0.3.0/ui-codemirror.min.js"
    ]}]
});

$stateProvider
    .state('site', {
        abstract: true,
        template: '<ui-view/>',
        resolve: {
            loadSiteCtrl: ['$ocLazyLoad', function ($ocLazyLoad) {
                return $ocLazyLoad.load(['codeMirror1', 'codeMirror2'])
            }]
        },
    })

Однако приведенный выше код по-прежнему возвращает:

angular.js:13920 ocLazyLoad.fileLoaded https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/codemirror.min.css
xml.min.js:1 Uncaught ReferenceError: CodeMirror is not defined
    at xml.min.js:1
    at xml.min.js:1
(anonymous) @ xml.min.js:1
(anonymous) @ xml.min.js:1
angular.js:13920 ocLazyLoad.fileLoaded https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/mode/xml/xml.min.js
htmlmixed.min.js:1 Uncaught ReferenceError: CodeMirror is not defined
    at htmlmixed.min.js:1
    at htmlmixed.min.js:1
(anonymous) @ htmlmixed.min.js:1
(anonymous) @ htmlmixed.min.js:1
angular.js:13920 ocLazyLoad.fileLoaded https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/mode/htmlmixed/htmlmixed.min.js
css.min.js:1 Uncaught ReferenceError: CodeMirror is not defined
    at css.min.js:1
    at css.min.js:1
(anonymous) @ css.min.js:1
(anonymous) @ css.min.js:1
angular.js:13920 ocLazyLoad.fileLoaded https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/mode/css/css.min.js
javascript.min.js:1 Uncaught ReferenceError: CodeMirror is not defined
    at javascript.min.js:1
    at javascript.min.js:1
(anonymous) @ javascript.min.js:1
(anonymous) @ javascript.min.js:1
angular.js:13920 ocLazyLoad.fileLoaded https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/mode/javascript/javascript.min.js
angular.js:13920 ocLazyLoad.fileLoaded https://cdnjs.cloudflare.com/ajax/libs/angular-ui-codemirror/0.3.0/ui-codemirror.min.js
angular.js:13920 ocLazyLoad.componentLoaded (3) ["ui.codemirror", "constant", "uiCodemirrorConfig"]
angular.js:13920 ocLazyLoad.componentLoaded (3) ["ui.codemirror", "directive", "uiCodemirror"]
angular.js:13920 ocLazyLoad.moduleLoaded ui.codemirror
angular.js:13920 ocLazyLoad.fileLoaded https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/codemirror.min.js

Кто-нибудь знает, что не так?

Ответы [ 2 ]

0 голосов
/ 21 мая 2018

Вместо создания модулей для разных библиотек попробуйте этот метод и посмотрите, работает ли он, потому что он работает нормально для меня:

resolve: {
  plugins: ['$ocLazyLoad', function($ocLazyLoad) {
    return $ocLazyLoad.load([
      "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/codemirror.min.css",
      "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/codemirror.min.js",
      "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/mode/xml/xml.min.js",
      "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/mode/htmlmixed/htmlmixed.min.js",
      "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/mode/css/css.min.js",
      "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/mode/javascript/javascript.min.js",
      "https://cdnjs.cloudflare.com/ajax/libs/angular-ui-codemirror/0.3.0/ui-codemirror.min.js"
    ]);
  }]
}
0 голосов
/ 18 мая 2018

Проблема заключается в том, что вы добавляете параметр serie к объекту конфигурации провайдера, , который игнорируется , поскольку он будет получать конфигурацию для каждого модуля и загружать их параллельно в любом случае.По сути, эта опция должна присутствовать в каждом модуле, скрипты которого необходимо загружать по порядку.

Быстрое решение для вас - использовать обещания, чтобы убедиться, что модули загружены по порядку.,Поскольку вызов load() возвращает обещание, мы можем выполнить вторую загрузку после этого:

$ocLazyLoadProvider.config({
    debug: true,
    modules: [{ 
        name : 'codeMirror1', 
        files: [
            "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/codemirror.min.css",
            "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/codemirror.min.js"
    ]},{
        name : 'codeMirror2',
        files: [
            "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/mode/xml/xml.min.js",
            "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.36.0/mode/htmlmixed/htmlmixed.min.js",
            ...
    ]}]
});

...
loadSiteCtrl: ['$ocLazyLoad', function ($ocLazyLoad) {
    return $ocLazyLoad.load(['codeMirror1']).then(function() {
      return $ocLazyLoad.load(['codeMirror2'])
    });
}]
...

Проверить этот плункер для рабочего примера этого.

В качестве альтернативы, поскольку CodeMirror поддерживает загрузчики модулей , а ocLazyLoad прекрасно работает с requireJS, вам может быть интересно попробовать его.Вы бы установили requireJS в качестве загрузчика для модулей на ocLazyLoad, и при загрузке модулей, которые зависят от CodeMirror, он удостоверится, что они уже были загружены (то есть вам не нужно делать что-то последовательно).

...