How to load koLite with requirejs?

Question

This is from knockout.dirtyFlag.js

;(function (ko) {
        ko.DirtyFlag = function (objectToTrack, isInitiallyDirty, hashFunction) {

            hashFunction = hashFunction || ko.toJSON;

            var
                _objectToTrack = objectToTrack,
                _lastCleanState = ko.observable(hashFunction(_objectToTrack)),
                _isInitiallyDirty = ko.observable(isInitiallyDirty),

                result = function () {
                    var self = this;

                    self.isDirty = ko.computed(function () {
                        return _isInitiallyDirty() || hashFunction(_objectToTrack) !== _lastCleanState();
                    });

                    self.reset = function () {
                        _lastCleanState(hashFunction(_objectToTrack));
                        _isInitiallyDirty(false);
                    };

                    return self;
                };

            return result;
        };
    })(ko);

In my model I have a define setup like this:

define([
    "lib/knockout",
    "lib/knockout.dirtyFlag"
],
function(ko) {
...
  self.dirtyFlag = new ko.DirtyFlag([
}

basically I get an error saying that DirtyFlag is undefined.

What do I need to do?

score 2 · Accepted Answer · answered Mar 07 '13 at 17:17

Well, looks like I got it working, so I'll post my findings:

In my requirejs config I added this:

shim: {
"lib/knockout/knockout.dirtyFlag": {
    deps: [
        "lib/knockout/knockout"
    ],
    init: function (ko) {
        var self = this;
        ko.DirtyFlag = self.ko.DirtyFlag;
        return ko;
    }
}

I'm not very familiar with javascript or requirejs, but init seems to put the dep in "ko" and then I am able to create a DirtyFlag on ko. self.ko.DirtyFlag is the actual knockout.dirtyFlag javascript.

SteveP · Answer 2 · 2013-03-07T16:55:05.287

0

You are requiring lib/knockout and lib/knockout.dirtyFlag. Do you need both ?

If you need both, try:

define([
    "lib/knockout",
    "lib/knockout.dirtyFlag"
],
function(ko, kodf) {
...
  self.dirtyFlag = new kodf.DirtyFlag([
}

You could also try:

define([
    "lib/knockout",
    "lib/knockout.dirtyFlag"
],
function(k) {
...
  self.dirtyFlag = new ko.DirtyFlag([
}

As I think you are defining ko in the require as well as in knockout.dirtyFlag.

edited Mar 07 '13 at 16:55

answered Mar 07 '13 at 16:46

SteveP

18,840
9
47
60

says kodf is undefined when I try this – O.O Mar 07 '13 at 16:50
Is the page loading knockout.dirtyFlag.js ? – SteveP Mar 07 '13 at 16:53

score 0 · Answer 3 · answered Mar 16 '13 at 04:27

I have ended with wrapping kolite classes with define methods. Below example with command, but it will be same for others.

requirejs.config({
paths: {
    knockout: 'Scripts/libs/knockout/knockout-2.2.1.debug',
    command: 'Scripts/libs/knockout/knockout.command'
},

shim: {
    knockout: {
        exports: 'ko'
    },
    command: {
        deps: ['knockout'],
        exports: 'ko'
    }
});

And wrapped command

define(['knockout'], function(ko) {
  ... // command original code
  return ko;
)

in my module

define(['command'], function (ko) {
    var doYourStaff = 0;
    return doYourStaff;
});

knockout.command.js has several functions within it like this ;(function(ko)..... How did you do a define for each of them? Please paste your knockout.command.js file. — O.O, Mar 26 '13 at 16:34

score 0 · Answer 4 · answered Dec 28 '13 at 11:09

0

We have added support for RequireJS for all three libs now, you can use the latest version from master.

answered Dec 28 '13 at 11:09

hfjallemark

9
1

If you are affiliated with this software can you please make it clear in your answer. Otherwise there is the danger this will get deleted as spam. – ChrisF Dec 28 '13 at 12:08
Oh, did not know that. So yes, I am one of the co-authors. – hfjallemark Jan 17 '14 at 16:30

How to load koLite with requirejs?

4 Answers4

Linked