1
votes

I have a directory structure like this:

├── index.html
├── static
│   └── js
│       ├── main.js
│       ├── jquery.js
│       └── require.js
└── subfolder
    └── index.html

In my top-level index.html, I'm loading require.js like this, and it works:

<script data-main="static/js/main" src="static/js/require.min.js"></script>

However, in subfolder/index.html, I can't load require.js succesfully:

<script data-main="../static/js/main" src="../static/js/require.min.js"></script>

Which results in "Script error for: jquery", and the same for each dependency of my main module.

The baseUrl for require.js is set to static/js. Because these pages are intended to be used locally, I can't use an absolute url. How can I get require.js to work from the subfolders?

Contents of the main.js file:

require.config({
    baseUrl: 'static/js',
    paths: {
        'jquery': 'jquery-2.0.3',
    }
});

require(['jquery'], function($) { ... }
1
show your main.js file. - Rupesh
have you tried baseUrl: '../static/js'? - Tomer
If I did that, then the top-level index.html would stop working. - borntyping

1 Answers

2
votes

The solution was to not set baseUrl at all:

If no baseUrl is explicitly set in the configuration, the default value will be the location of the HTML page that loads require.js. If a data-main attribute is used, that path will become the baseUrl.

Removing the baseUrl setting resulted in the above example working correctly.