I am trying to 'optimze' my requireJS/Backbone project I succeeded running r.js under node environment, the problem is the output from the r.js compiler throws 'unexpected identifier'
index.html has the following
<script data-main="assets/core/system/init" src="assets/core/system/require.js"></script>
r.js config as the following
({
paths: {
models: '../models',
views: '../views',
templates: '../templates',
app: '../app',
utils: '../utils',
collections: '../collections',
dataTypes: '../utils/dataTypes',
elementTypes: '../utils/elementTypes',
controls: '../controls',
modals: '../modals',
common: '../common'//,
},
shim: {
'backbone': {
deps: ['underscore', 'jquery'],
exports: 'Backbone'
},
'underscore': {
exports: '_'
},
'jqueryUI': {
deps: ['jquery']
},
'jquery': {
exports: '$'
},
'bootstrap': {
deps: ['jquery']
},
'common/highcharts/main': {
exports: 'highcharts',
deps: ['jquery']
},
'app/config': {
deps: ['underscore', 'jquery']
},
'common/placeHolder/main':{
deps: ['jquery'],
exports: 'placeHolder',
init: function(jquery){
jquery('input, textarea').placeholder();
}
},
'validation': {
deps: ['jquery']
}
},
baseUrl : "assets/core/system",
name: "init",
out: "main.js",
removeCombined: true,
findNestedDependencies: true
})
The problem was the following syntax
$('<div>',{
style: 'position:absolute;'
});
The above syntax is creating element width attributes using jquery. The compiler and seems like IE7 too doesn't like it.
To correct it, I change it to the following. ( adding comma -'- to the property name )
$('<div>',{
'style': 'position:absolute;'
});