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?

Answer 1

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.

Answer 2

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;
});

Answer 3

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

Answer 4

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.