get requirejs-config.js to load declared cdn's for jquery

Question

I have been trying to get the requirejs-config.js to load, but as of yet it will not.. I have followed http://devdocs.magento.com/guides/v2.0/javascript-dev-guide/javascript/custom_js.html and put the file like,

/app/design/frontend/<vendor>/<theme>/requirejs-config.js

containing

(function() {
/**
 * WSU something
 */
var config = {
 "paths": {'jquery':'https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js',
 'jquery/ui':'https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js',
 'spin':'https://repo.wsu.edu/spine/1/spine.min.js?2015-16-12',
 'datatables':'//cdnjs.cloudflare.com/ajax/libs/datatables/1.9.4/jquery.dataTables.min.js'},
 map:{'*':{'jquery':'https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js',
 'jquery/ui':'https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js',
 'spin':'https://repo.wsu.edu/spine/1/spine.min.js?2015-16-12',
 'datatables':'//cdnjs.cloudflare.com/ajax/libs/datatables/1.9.4/jquery.dataTables.min.js'}}
};
require.config(config);
})();

NOTE that I started with

var config = {
 "paths": {'jquery':'https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js',
 'jquery/ui':'https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js',
 'spin':'https://repo.wsu.edu/spine/1/spine.min.js?2015-16-12',
 'datatables':'//cdnjs.cloudflare.com/ajax/libs/datatables/1.9.4/jquery.dataTables.min.js'},
 map:{'*':{'jquery':'https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js',
 'jquery/ui':'https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js',
 'spin':'https://repo.wsu.edu/spine/1/spine.min.js?2015-16-12',
 'datatables':'//cdnjs.cloudflare.com/ajax/libs/datatables/1.9.4/jquery.dataTables.min.js'}}
};

which is what the doc indicate but also doesn't work..

The issue is it never loads. Just in case I have also run php bin/magento setup:static-content:deploy with not luck.

How do we get the new paths declared

Answer 1

After much trail this is what boiled out. The location of the requirejs-config.js is correct as the docs indicate,

/app/design/frontend/<vendor>/<theme>/requirejs-config.js

But the why this didn't work was that if you redid the jQuery to a CDN then everything else would fail as the mappings were based on that (as I understand it at this time). This is what I ended up needing to do to get everything to load an show up.

var config = {
 "paths":{
 'jquery':'https://code.jquery.com/jquery-1.11.3.min',
 '_jquery':'jquery/',
 'jquery/ui':'https://code.jquery.com/ui/1.11.4/jquery-ui',
 'jquery/jquery-migrate':'https://code.jquery.com/jquery-migrate-1.2.1.min',
 'spine':'https://repo.wsu.edu/spine/1/spine.min.js?2015-16-12',
 'datatables':'//cdnjs.cloudflare.com/ajax/libs/datatables/1.9.4/jquery.dataTables.min'},
 map: {
 "*": {
 "jquery/jquery.mobile.custom": "/static/frontend/wsu/wsu_base/en_US/jquery/jquery.mobile.custom.js",
 'jquery/jquery.cookie':"/static/frontend/wsu/wsu_base/en_US/jquery/jquery.cookie.js",
 'jquery/jquery.validate':'/static/frontend/wsu/wsu_base/en_US/jquery.validate.js',
 'jquery/jquery.metadata':'/static/frontend/wsu/wsu_base/en_US/jquery/jquery.metadata.js',
 'jquery/jquery-ui-timepicker-addon':'/static/frontend/wsu/wsu_base/en_US/jquery/jquery-ui-timepicker-addon.js'
 }
 },
 "shim": {
 "spine" : ["jquery","jquery/ui"],
 "datatables" : ["jquery","jquery/ui"]
 },deps: [
 "spine",
 "datatables"
 ]
};

• Chedaroo: Whilst I wasn't the specific issue I was facing, this answer helped me with my own problem, thanks for sharing
• Chirag Prajapati: @jeremy.bass After that how should I use this "datatables" js in require({}) block or in phtml?
• Quantum: @chirag the datatables shown is Jquery Datatables, and was initiated in the theme's main JS file on document ready.

Answer 2

in official doc for add to theme you need add to /app/design/frontend/<vendor>/<theme>/web/js not as i see in your question /app/design/frontend/<vendor>/<theme>/requirejs-config.js remove rm -rf var/view_preprocessed/* Other think not forget to remove your theme stack in pub static folder:

rm -rf pub/static/<vendor>/<theme>

and run

php bin/magento setup:static-content:deploy

for be sure ...

• Quantum: I will give it a try but the docs say "3.Place your requirejs-config.js file in one of the following directories ◦Your theme files: <theme_dir>" also php bin/magento setup:static-content:deploy starts with clearing pub/static/ just for your info, I have watched it do that so rm -rf pub/static/<vendor>/<theme> is redundant. Thank you for helping, I'll try moving it to <theme_dir>/web/js/, maybe the docs are off.. not the first time lol
• Ibnab: also php bin/magento setup:static-content:deploy starts with clearing pub/static/ just for your info, I have watched it do that so rm -rf pub/static/<vendor>/<theme> is redundant is not totally real after tones of test ... you will retour to it
• Quantum: sorry? not sure if I follow. I can see the folder be deleted, and I can find this in the code.. github.com/magento/magento2/blob/… I am still in the belief it is redundant to clear the folders first, redundant in the mind set that your fingures have to type extra stuff and the code will try to do it, not that you can delete an already deleted file again..