Использование JustGage с Require.js

Question

JustGage использует Raphael, который, как хорошо здесь обсуждается, не совместим с AMD (и поэтому не работает с Require.js).

Я раньше не использовал Require.js и не использовал JS, поэтому я борюсь за то, чтобы обдумать это. Было много проб и ошибок;)

Используя предложенный здесь подход, я разбил модули Raphael на отдельные файлы и включил их отдельно, а также сделал предположение о том, что делать для JustGage.

require.config({
    paths: {
        //other links removed
        'eve': 'vendor/eve/eve',
        'raphael-core': 'vendor/raphael/raphael.core',
        'raphael-svg': 'vendor/raphael/raphael.svg',
        'raphael-vml': 'vendor/raphael/raphael.vml',
        'raphael': 'vendor/raphael/raphael.amd',
        'justgage': 'vendor/justgage/justgage.1.0.1.min'
    },
    shim: {
        'eve': {
            exports: "eve"
        },
        'raphael': {
            deps: ['eve'],
            exports: "Raphael"
        },
        'justgage': {
            deps: ['raphael'],
            exports: "JustGage"
        }
    }
});

Но в инструкциях говорится: "После описанной выше конфигурации вы можете начать использовать Raphael, как и другие модули require-js", что не очень полезно;)

Я думаю, что мне нужно сделать что-то в main.js?

На моей странице cshtml у меня есть

require(["raphael", "justgage"], function(JustGage) {
    $(function() {
        var a = new JustGage({
            id: "pvgauge",
            value: @Model.GaugeValues.PV,
            min: @Model.PVGauge.MinValue,
            max: @Model.PVGauge.MaxValue,
            title: "Personal Volume",
            label: "PV",
            levelColors: gaugeSettings.levelColors,
            levelColorsGradient: gaugeSettings.levelColorsGradient,
            showInnerShadow: gaugeSettings.showInnerShadow,
            shadowSize: gaugeSettings.shadowSize,
            labelFontColor: '#7ACE30',
            titleFontColor: gaugeSettings.titleFontColor,
            valueFontColor: gaugeSettings.valueFontColor
        });
    });
});

Теперь это как минимум находит JustGage, но теперь выдает ошибку 'Raphael' is undefined.

(Я также попытался просто сделать сценарий включения непосредственно в файл cshtml, но получить ошибку 'Mismatched anonymous define() module: function (eve) {')

Верно ли мое понимание того, что Require.js означает, что вещи не находятся в глобальной области видимости? И JustGage ожидает, что Рафаэль будет в глобальном масштабе?

Любая помощь в работе JustGage? Или рекомендации для эквивалентной библиотеки для датчиков типа "speedo", которые будут работать с Require.js?

Answer 1

Почти там, вам нужно добавить его в функцию, так что он доступен для JustGage.

require(["raphael", "justgage"], function(raphael,JustGage) {

Если justgauge - это модуль, вы должны загрузить зависимость в модуль, так как он будет искать в этом модуле Raphael, однако, поскольку вы уже загрузили его, он должен работать,

легче отслеживать ваши зависимости и загружать их по мере необходимости,

define(['module' , "pathto/raphael"], function (module, raphael) {

Answer 2

Это сработало для меня:

require('eve');
window.Raphael = require('raphael');
require('justgage');