undefined
? As in, what’s the variable name that is supposed to be an object with an extend
function?
DefineMap
variable.
can-map-define
code like this: https://github.com/canjs/can-map-define#standalone-use
i add script with can-map-define.js from dist folder and then add script with exported global script from app.
so now i got 2 errors.
first: can-map-define.js:133 Uncaught TypeError: Cannot set property 'define' of undefined(…)
second: avatar.js:126 Uncaught TypeError: Cannot read property 'extend' of undefined(…)
mapHelpers
is undefined
in can-map-define.js
… because can-map
is probably not included
so, i try another solution, add latest can-define global script from dist and error dissapear, but now another error appear avatar.js:795 Uncaught TypeError: stache is not a function(…)
so i try add can-stache global script or can.all from dist with all deps, and error still exist. idk what to do, so may be later someone tell me correct steps to use global script. thank you :)
$.ajaxSetup({
headers: {
'X-CSRF-Token': $('meta[name="_token"]').attr('content')
}
});
var stealTools = require("steal-tools");
stealTools.export({
system: {
main: "my-module",
config: __dirname+"/package.json!npm"
},
outputs: {
"+global-js": {},
"+global-css": {}
}
});
i use this instructions
http://stealjs.com/docs/steal-tools%7Clib%7Cbuild%7Chelpers%7Cglobal.html
@frank-dspeed now i use steal/steal-tools 1.0. change build js with 1.0 migration guide. export as a global, try include and old error is shown.
avatar-maker.js:126 Uncaught TypeError: Cannot read property 'extend' of undefined(…)
i think its about missing can-map..
am i need to include this deps:
import CanMap from "can-map";
import "can-map-define";
import route from 'can-route';
import "can-route-pushstate";
import stache from "can-stache";
import 'can-stache/helpers/route';
but as a global scripts before my global app script?
+standalone
rather than +global-js
System.import
in your “component” scripts
.ajax
on it to $.ajax
dist
files.
eachModules
CJS
or AMD
build
stealTools.export
and the guide @cherifGsoul mentioned shows exactly this
can-stache
in its global export
bit-tabs
can-*
dependencies and then use System.import to import the components like bit-tabs
bit-tabs.js
that included jquery
and bit-cal.js
that also included jquery
// bit-tabs.js
define("jquery", function(){
// jquery code
})
define("bit-tabs",["jquery"], function(){
// bit-tabs code
})
// bit-cal.js
define("jquery", function(){
// jquery code
})
define("bit-cal",["jquery"], function(){
// bit-cal code
})
jquery
bundles
config can be written so jquery
is in two spots. @matthewp ?
steal.bundle
really doesn't relate to this problem
// bit-tabs.js
define("bit-tabs#jquery", function(){
// jquery code
})
define("bit-tabs",["jquery"], function(){
// bit-tabs code
})
bit-tabs.js
looked like, people should re-write their config
map: {jquery: "bit-tabs/jquery"}
module reference
, module name
, and module address
is very important
<script>
export by default
<script>
tags ... they tend to be creating their own dependency graph
bit-cal: canjs
bit-tabs: canjs
canjs: jquery
bit-cal
is needed on a page, it will write out script tags for canjs
and jquery
<script>
dependencies in a similar way
dependencies
in the build
bit-cal: canjs //widgets.com/bit-cal.js
bit-tabs: canjs //widgets.com/bit-tabs.js
canjs: jquery //canjs.com/release/can.js
jquery: //cdn.com/jquery/dist/jquery.js