I am trying to get the themes/cms/build/js/main.min.js
file to work properly after being loaded by RequireJS , but I have not been successful.
The file is loaded, some functions work as console.log()
, but others like $(element).each()
, $(element).click()
do not work as expected.
In the code below, in the file main.min.js
I try to add the color red in the .content-title class, but nothing happens, the class does not the red color css.
What am I doing wrong?
app / app.js
'use strict';
require.config({
baseUrl: "./app",
// alias libraries paths
paths: {
'jquery': './components/jquery/dist/jquery.min',
'domReady': './components/domReady/domReady',
'angular': './components/angular/angular.min',
'angularRoute': './components/angular-route/angular-route.min',
'angularCSS': './components/angular-css/angular-css.min',
'satellizer': './components/satellizer/dist/satellizer.min',
'bootstrap': './components/bootstrap/dist/js/bootstrap.min',
'main': '../themes/cms/build/js/main.min',
// components of site
'adminLTE': '../themes/cms/build/js/adminLTE.min',
'fastclick': './components/fastclick/lib/fastclick',
'helpers': './config/helpers',
'script': './components/script.js/dist/script.min'
},
shim: {
'jquery': {
exports: 'jquery'
},
'angular': {
exports: 'angular'
},
'angularRoute': [ 'angular' ],
'angularCSS': [ 'angular' ],
'satellizer': [ 'angular' ],
'script': {
exports: 'script',
deps: [ 'angular' ]
},
'bootstrap': {
exports: 'bootstrap',
deps: [ 'jquery' ]
},
'fastclick': {
exports: 'fastclick',
deps: [ 'jquery' ]
},
'adminLTE': {
exports: 'adminLTE',
deps: [ 'jquery', 'bootstrap', 'fastclick' ]
},
'helpers': {
exports: 'helpers'
},
'main': {
exports: 'main',
deps: [ 'jquery', 'bootstrap', 'adminLTE' ]
}
},
deps: [ './config/bootstrap', './config/helpers' ]
});
app / config / app.js
'use strict';
define([ 'angular', 'angularRoute', 'angularCSS', 'satellizer', 'jquery', 'bootstrap', 'adminLTE', 'main', 'helpers', '../factories/index', '../directives/index', '../controllers/index' ], function (ng) {
return ng.module('app', [
'app.factories',
'app.directives',
'app.controllers',
'ngRoute',
'angularCSS',
'satellizer'
])
.run([
'$rootScope', '$location', '$auth', '$route',
function( $rootScope, $location, $auth, $route ) {
$rootScope.site = {
name: 'System MMN',
api: api
};
$rootScope.pageParams = {
title: 'Dashboard',
id: 'dashboard'
};
$rootScope.$watch($auth.isAuthenticated(), function() {
if(!$auth.isAuthenticated()) {
$location.path( '/login' );
}
});
$rootScope.$on("$routeChangeSuccess", function(event, current, previous){
$rootScope.currentTemplate = 'app/views/pages/' + current.$$route.page + '.html';
});
}]);
});
themes / cms / assets / js / main.js - Compiled to themes / cms / build / js / main.min.js
'use strict';
define(['jquery'], function( $ ) {
$(function() {
// Não funciona
$('.content-title').css('color', 'red');
// Não funciona
$('.content-title').each(function() {
$(this).text('Oi, isso é um teste');
});
// console log funciona
console.log('Work?');
});
});
Thank you!