最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - RequireJS does not follow relative path for data-main with baseUrl set - Stack Overflow

programmeradmin0浏览0评论

Using requireJS, I am trying to specify a path for my data-main that is different from the baseUrl. It seems that requireJS is ignoring whatever I type before the file name, and always look for the file in the baseUrl folder.

I have the following folder structure :

index.html
scripts/
  lib/
    require.js
  test/
    main2.js
  config.js

Contents of index.html :

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>Test</title>
        <script data-main="test/main2" src="scripts/lib/require.js"></script>
        <script src="scripts/config.js"></script>
    </head>

    <body></body>
</html>

Contents of config.js :

requirejs.config({
    baseUrl: "scripts"
});

And I am getting a 404 error for : GET [...]/scripts/main2.js , even though it should be looking for [...]/scripts/test/main2.js. If I remove the config.js file and use data-main="scripts/test/main2" it works, but I would like to be able to specify a baseUrl for my project.

Any ideas ?

Edit : following the answer by Waxen :

  • Even if I use "scripts/test/main2", "/scripts/test/main2", or "whateverIWant/main2" in my data-main, it oddly always looks for "scripts/main2.js"

Note that I am using requirejs 2.1.8

Using requireJS, I am trying to specify a path for my data-main that is different from the baseUrl. It seems that requireJS is ignoring whatever I type before the file name, and always look for the file in the baseUrl folder.

I have the following folder structure :

index.html
scripts/
  lib/
    require.js
  test/
    main2.js
  config.js

Contents of index.html :

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>Test</title>
        <script data-main="test/main2" src="scripts/lib/require.js"></script>
        <script src="scripts/config.js"></script>
    </head>

    <body></body>
</html>

Contents of config.js :

requirejs.config({
    baseUrl: "scripts"
});

And I am getting a 404 error for : GET [...]/scripts/main2.js , even though it should be looking for [...]/scripts/test/main2.js. If I remove the config.js file and use data-main="scripts/test/main2" it works, but I would like to be able to specify a baseUrl for my project.

Any ideas ?

Edit : following the answer by Waxen :

  • Even if I use "scripts/test/main2", "/scripts/test/main2", or "whateverIWant/main2" in my data-main, it oddly always looks for "scripts/main2.js"

Note that I am using requirejs 2.1.8

Share Improve this question edited Jan 22, 2015 at 16:23 Luca 9,7155 gold badges47 silver badges60 bronze badges asked Oct 30, 2013 at 12:44 personne3000personne3000 1,8403 gold badges18 silver badges27 bronze badges 1
  • I've rolled back your last edit - it was misleading to see the code from the accepted answer in your question. The fact that you have accepted an answer is enough to tell other users what the solution to the problem in your question, is! – Luca Commented Jan 22, 2015 at 16:25
Add a comment  | 

2 Answers 2

Reset to default 11

This isn't working how you want it to because you're calling require with a data-main before you're setting the baseURL. I'm not sure why it's trying to go to scripts/main2.js though; I would expect it to attempt to load test/main2.js rather than scripts/main2.js. However, that's beside the point.

What you need to do is make sure that your baseURL is available to require before it tries to load you data-main. This can be accomplished by including your config first and using the syntax from the second example here: http://requirejs.org/docs/api.html#config.


Contents of index.html :

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>Test</title>
        <script src="scripts/config.js"></script>
        <script data-main="test/main2" src="scripts/lib/require.js"></script>
    </head>

    <body></body>
</html>

Contents of config.js :

var require = {
    baseUrl: "scripts"
};

I read this thread and couldn't quite understand why using the data-main attribute to point to a configuration js file wouldn't be the same as specifying the configuration before loading Require, as the answer to this thread suggests.

In my experiments, I learned that setting values using a data-main config js file might work (then, again, it might not). To those new to Require and AMDs and asynchronisity in general, the "might work" notion has to do with the fact that asynchronous operations run when then can--and not in any predictable order.

Having established that, there is a very important point made in the current version of the RequireJS documentation that eluded me until now:

You may also call require.config from your data-main Entry Point, but be aware that the data-main script is loaded asynchronously. Avoid other entry point scripts which wrongly assume that data-main and its require.config will always execute prior to their script loading.

For further information, see: http://requirejs.org/docs/api.html#data-main

Being new to RequireJS, I was mildly appalled to learn this--and I wasted a lot of time trying to debug path-access problems. At this stage it is unclear to me why anyone would use data-main (especially to define a baseUrl) since this reference will only randomly work. Instead the solution suggested by this thread (in which you set the baseUrl in a script tag that is NOT asynchronous, will work as expected and will reliably set the RequireJS configuration before kicking-off RequireJS.

发布评论

评论列表(0)

  1. 暂无评论