CODEWITHSUNDEEP
javascripthtml
chillydk147
chillydk147

Reputation: 161

RequireJs won't load script by name

I've just started to learn about RequireJs but am unable to load a js dependency using it's custom shortened name. I don't understand what I'm doing wrong here, I try to load the knockout js library using only "knockout" but it throws an error 

Error: Script error for "knockout"
http://requirejs.org/docs/errors.html#scripterror

if I use "knockout-3.4.0" it works fine but I'd prefer to use the shortened

<!DOCTYPE html>
<html>
	<head>
		<script type="text/javascript" data-main="js/init.js" src="js/require.js"></script>
	</head>
    <body>
        <h1 data-bind="text: TabIndx">Hello World</h1>		
		<script>
		require(['knockout', 'viewModel'], function(ko, viewModel) {
			var vm = new viewModel();
			ko.applyBindings(vm);
		});
		</script>
    </body>
</html>

require.config({
	baseUrl: 'js',
    paths: {
        knockout: 'knockout-3.4.0',
		viewModel: 'viewModel'
    }
});

Upvotes: 0

Views: 232

Answers (1)

Shakespeare
Shakespeare

Reputation: 1286

I suspect this is because RequireJS hasn't fully loaded itself and its custom configuration before you're requesting local paths. What you should really be doing if you're using RequireJS is having a module responsible for creating the view model and applying the bindings like in your example.

// app.js
define(['knockout', 'viewModel'], function (ko, viewModel) {
    var vm = new viewModel();
    ko.applyBindings(vm);
});

require.config({
    baseUrl: './js/',
    paths: {
        knockout: 'knockout-3.4.0',
        viewModel: 'viewModel',
        app: 'app'
    }
});

I'm not sure how init.js looks, but here I have made it a little module responsible for launching the app.js file.

define(['app'], function (app) {
    app.init();
});

Your config should ideally be refactored into its own file, where require-config.js just contains your config snippet, like so: -

<script type="text/javascript" data-main="js/init.js" src="js/require.js"></script>
<script type="text/javascript" src="js/require-config.js"></script>

Upvotes: 1

Related Questions