數據主屬性<script> tag that doesn't load require.js works

Question

我做了一些意外發現，我能夠在不加載 requireJS 的文件中加載我的數據主 js 文件

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

它完美地加載了我的 theme.js 文件

這是requirejs的有意特性嗎？ 還是一個錯誤？

我希望這不是一個錯誤。

我的 requirejs.config.js 的內容如下

var require = {
    baseUrl: '/js/',
    paths: {
        'jquery': "lib/jquery/jquery",
        'bootstrap': "lib/bootstrap/js/bootstrap"
    },
    shim: {
        'bootstrap': ['jquery']
    },
    map: {
        '*': {
            'jquery': 'jQueryNoConflict'
        },
        'jQueryNoConflict': {
            'jquery': 'jquery'
        }
    }
}

我檢查了這里的每個樣本，似乎他們沒有做我意外發現的事情。

http://requirejs.org/docs/api.html#data-main

Answer 1

我已經能夠使用 RequireJS 2.1.20 重現您的報告的行為。 您可以在此處看到執行檢查的代碼：

if (isBrowser && !cfg.skipDataMain) {
    //Figure out baseUrl. Get it from the script tag with require.js in it.
    eachReverse(scripts(), function (script) {

eachReverse循環以相反的順序查看所有script元素。 由於 DOM 的工作方式，只有在 HTML 中加載 RequireJS 的script元素和它之前的那些元素才會被循環，因為當這段代碼執行時，HTML 仍在被瀏覽器解析的過程中。 （因此，加載 RequireJS 之后的script元素的 DOM 節點尚不存在。）循環中的函數會搜索，直到遇到具有data-main的script元素。 它可能是加載 RequireJS 的那個，也可能是它之前的任何一個。

我不知道是否將此視為錯誤或具有意外副作用的功能。 人們可能想要更改邏輯以檢查script元素的src屬性是否也指向包含 RequireJS 的文件。 然而，在我看來這會很脆弱。 （它不能只是一個簡單的文件名比較，因為如果您決定更改文件名，代碼將會中斷。）

Answer 2

您的 data-main 位於錯誤的腳本標簽上

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

你也不需要.js

根據require.js 文檔

<!--when require.js loads it will inject another script tag
    (with async attribute) for scripts/main.js-->
<script data-main="scripts/main" src="scripts/require.js"></script>

編輯：

Applogies...我誤讀了這個問題。

我只是快速查看了requirejs源代碼，它之所以有效是因為它正在查找所有script元素（ document.getElementsByTagName('script'); ）並遍歷它們以查找data-main屬性。 所以實際上從理論上講，您可以使用data-main定義多個腳本，它會加載所有腳本。