[Sugar-devel] Sugarizer : failed to import library

laurent bernabe laurent.bernabe at gmail.com
Sat Sep 16 07:25:31 EDT 2017


Solved my problem !!!

Loader.js

requirejs.config({
baseUrl: "lib",
paths: {
activity: "../js"
}
});

requirejs(["activity/activity"]);

Activity.js

define(["sugar-web/activity/activity"], function (activity) {

    // Manipulate the DOM only when it is ready.
    require(['domReady!', 'konva'], function (doc) {

        // Initialize the activity.
        activity.setup();

        var stage = new Konva.Stage({
            container: 'canvas',
            width: 200,
            height: 200
        });

        var layer = new Konva.Layer();

        var circle = new Konva.Circle({
            x: stage.getWidth() / 2,
            y: stage.getHeight() / 2,
            radius: 70,
            fill: 'red',
            stroke: 'black',
            strokeWidth: 4
        });

        layer.add(circle);

        stage.add(layer);
    });

});


In fact, I just need to put Konva library inside lib folder, and add
'konva' in the activity require section ! So simple !

2017-09-16 13:15 GMT+02:00 laurent bernabe <laurent.bernabe at gmail.com>:

> Hello everyone,
>
> I tried to import the Konva <https://konvajs.github.io/docs/overview.html> library
> into my web activity (it is at least 500 ko unminified : is it a trouble ?)
> following the RequireJS shim section tutorial (I put it in the lib folder
> of my activity)
>
> ---------------------------- [ACTIVITY]/js/loader.js
> requirejs.config({
> baseUrl: "lib",
> paths: {
> activity: "../js"
> },
> shim: {
> 'konva': {
> exports: 'Konva'
> }
> }
> });
>
> requirejs(["activity/activity"]);
>
> -----------------------------
>
> [ACTIVITY]/js/activity.js
>
> define(["sugar-web/activity/activity"], function (activity) {
>
>     // Manipulate the DOM only when it is ready.
>     require(['domReady!'], function (doc) {
>
>         // Initialize the activity.
>         activity.setup();
>
>         var stage = new Konva.stage({
>             container: 'canvas',
>             width: 200,
>             height: 200
>         });
>
>         console.log(stage);
>
>         var layer = new Konva.layer();
>
>         var circle = new Konva.circle({
>             x: stage.getWidth() / 2,
>             y: stage.getHeight() / 2,
>             radius: 70,
>             fill: 'red',
>             stroke: 'black',
>             strokeWidth: 4
>         });
>
>         layer.add(circle);
>
>         stage.add(layer);
>     });
>
> });
>
>
> But I got Konva is undefined in my console.log() call.
>
> So, what did I misunderstood ?
>
> --
> Regards,
>
> Laurent Bernabé
>
> laurent.bernabe at gmail.com
>



-- 
Regards,

Laurent Bernabé

laurent.bernabe at gmail.com
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.sugarlabs.org/archive/sugar-devel/attachments/20170916/65ef818e/attachment.html>


More information about the Sugar-devel mailing list