/ / Durandal Weyland / Оптимізатор вимог з кендо ui dataviz - kendo-ui, requirejs, durandal, rjs, weyland

Оптимізатор Durandal Weyland / Requires з кендо та татавізом - кендо-ю, вимодж, дюндал, rjs, Weyland

Я будую додаток з Durandal для комплектаціїPhoneGap. Коли я намагаюся запустити оптимізатор weyland, я працюю над деякими проблемами. Побудова та оптимізація відмінно працює без помилок (я використовую requirejs як оптимізатор), але коли я запускаю програму, моя kendo ui chart видаляє помилку:

Якщо я пауза в режимі налагодження в хромі, деkendoChart зв'язування відбувається і введіть "kendo" в консолі я отримую kendoobject і може переглядати його властивості і так далі, так що це точно "в DOM".

Iv "e google навколо зовсім небагато і знайшов деякі нитки тут на SO, але жоден з них, здається, не відсортував мою проблему ця нитка або цей.

У мене є індивідуальний нокаут обов'язковий для діаграми, який наведений нижче.

Мій weyland.config виглядає так:

exports.config = function (weyland) {
weyland.build("main")
.task.jshint({
include: "App/**/*.js"
})
.task.uglifyjs({
// not uglyfying anything now...
//include: ["App/**/*.js", "Scripts/durandal/**/*.js", "Scripts/custom/**/*.js"]
})
.task.rjs({
include: ["App/**/*.{js,html}", "Scripts/custom/**/*.js", "Scripts/jquery/*.js", "Scripts/durandal/**/*.js"],
exclude: ["Scripts/jquery/jquery-2.0.3.intellisense.js", "App/main.js"],
loaderPluginExtensionMaps: {
".html": "text"
},
rjs: {
name: "main",
baseUrl: "App",
paths: {
"text": "../Scripts/text",
"durandal": "../Scripts/durandal",
"plugins": "../Scripts/durandal/plugins",
"transitions": "../Scripts/durandal/transitions",

"knockout": "../Scripts/knockout/knockout-2.3.0",
"kendo": "empty:", <-- tried refering kendo.all.min, or dataviz.chart or the path
"jquery": "../Scripts/jquery/jquery-2.0.3.min",
"Helpers": "../Scripts/custom/helpers",


........ other scripts ......
},
deps: ["knockout", "ko_mapping", "command"],
callback: function (ko, mapping, command) {
ko.mapping = mapping;
}
//findNestedDependencies: true, **<-- tried both true and false here**
inlineText: true,
optimize: "none",
pragmas: {
build: true
},
stubModules: ["text"],
keepBuildDir: false,
out: "App/main-built.js"
}
});
};
// The custom binding for the kendo chart
define([
"knockout",
"jquery",
"Helpers",
"kendo/kendo.dataviz.chart.min"
], function (
ko,
$,
helpers,
kendoui
) {
function drawChart(element, values, options) {
$(element).kendoChart({ **<-- this is where I get an error**
... options for chart ...
});
}

// kendoUi data viz chart
ko.bindingHandlers.moodChart = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
//set the default rendering mode to svg
kendo.dataviz.ui.Chart.fn.options.renderAs = "svg";  **<-- this renders no errors**
// if this is a mobile device
if (kendo.support.mobileOS) {
// canvas for chart for you!
kendo.dataviz.ui.Chart.fn.options.renderAs = "canvas";
}

var values = ko.unwrap(valueAccessor());

setTimeout(function () {
drawChart(element, values);
}, 125);
}
};
});

Я можу додати, що все працює відмінно, виконуючи не оптимізований код у веб-браузері (або телефоні).

Я також спробував прокласти шлях kendo в конфігураційному файлі і додати залежність до jquery, що, здається, не робить ніякої різниці.

Будь-яка допомога буде вдячна!

Відповіді:

3 для відповіді № 1

Для великих фреймворків на зразок кендо, які мають своївласний набір залежностей, наприклад, jquery версія, я, як правило, не пов'язувати їх з моїми власними модулями AMD. Особисті уподобання, я знаю. Подивіться, як ви можете завантажити jquery, knockout і kendo через звичайні теги сценарію в .NET приклад

 <body>
<div id="applicationHost"></div>

<script type="text/javascript" src="~/Scripts/jquery-1.9.1.js"></script>

<script type="text/javascript" src="~/Scripts/whateverKendoVersionGoesHere.js"></script>

<script type="text/javascript" src="~/Scripts/knockout-2.3.0.js"></script>
<script type="text/javascript" src="~/Scripts/bootstrap.js"></script>

<script type="text/javascript" src="~/Scripts/require.js" data-main="/App/main"></script>
</body>

Таким чином, jquery і нокаут будуть завантажені як глобалі. В main.js Ви повинні define jquery і knockout щоб зробити їх доступними для Дюрандаля (див main.js) як внутрішня система Durandal все ще використовує їх як модулі AMD.

requirejs.config({
paths: {
"text": "../Scripts/text",
"durandal": "../Scripts/durandal",
"plugins": "../Scripts/durandal/plugins",
"transitions": "../Scripts/durandal/transitions"
}
});

define("jquery", function () { return jQuery; });
define("knockout", ko);

define(["durandal/system", "durandal/app", "durandal/viewLocator"],  function (system, app, viewLocator) {
...
});