作者:手机用户2502936713 | 来源:互联网 | 2023-05-27 15:11
在给定项目结构的情况下,我无法理解如何为requirejs设置基本URL.
问题:并非所有html文件都在同一文件夹级别.脚本文件路径不断变化,具体取决于html页面的位置.
我尝试了什么:我已经搜索了API,但我只是不明白BaseURL应该是什么,以获得所有页面的正确路径.我已经测试了变体(../js/lib,/ js/lib /,我试过在main.js文件中没有包含它)但下面这个是唯一一个似乎在某些文件上产生正确结果的文件.
Main.js
requirejs.config({
baseUrl: '../js/lib',
paths: {
'jquery' : (document.addEventListener) ? ['vendor/jquery'] : ['vendor/jquery-1.9.1']
},
shim: {
'foundation/foundation': {
deps: ['jquery']
},
'foundation/foundation.alert': {
deps: ['jquery', 'foundation/foundation']
},
'vendor/slick.min': {
deps: [
'jquery',
'foundation',
'foundation/foundation.interchange'
],
exports: 'slick'
}
}
});
requirejs(['jquery'
, 'foundation/foundation'
]);
文件夹结构
Main Folder
?
? Some Folder
? ??? css
? ??? js
? ? ??? lib
? ? ? ??? foundation
? ? ? ? ??? foundation.alert.js
? ? ? ? ??? ...(foundation component js files)
? ? ? ? ??? foundation.js
? ? ? ??? vendor
? ? ? ? ??? jquery-1.9.1.js
? ? ? ? ??? jquery.js
? ? ? ??? foundation.min.js
? ? ? ??? slick.min.js
? ? ? ??? slickModule.js
? ? ??? main.js
? ? ??? require.js
? ??? html
? ? ??? components
? ? ? ??? slider.html [All scripts throw 404: Main Folder/Some Folder/html/js/lib/vendor/file.js ]
? ? ??? home.html [loads files as expected]
? ? ??? second.html [loads files as expected]
? ? ??? subfolder
? ? ? ??? random.html
? ??? extra folder
? ? ??? index.html [All scripts throw 404: Main Folder/Some Folder/extra folder/js/lib/vendor/file.js ]
? ?
? Another Folder
? ??? index.html [All scripts throw 404]
/html/components/slider.html
当我尝试以这种方式调用require时,slickModule的url是"Main Folder/Some Folder/html/js/lib/slickModule.js" - 注意'html'是在基本url之后添加的
...
有人可以帮我看看为什么会这样吗?
如果它甚至可能,我该怎么做才能使基本URL保持一致?
1> rockerest..:
摘要
不要连续两次使用相同的文件,特别是如果它是更改配置选项的文件,特别是如果它使用相对路径.
使用单个应用程序入口点.如果无法在一个地方启动应用程序,则使用该data-main
属性将很困难(尽管不是不可能).
paths
当您包含模块或设置配置时,使用配置选项指向文件,而不是相对路径.
单一入口点
首先,您可能会遇到data-main
属性的一些问题,因为当用于多个入口点时,它的行为没有记录.正如它所说:
如果要require()
在HTML页面中进行调用,则最好不要使用data-main.data-main仅在页面只有一个主入口点data-main脚本时使用.对于要进行内联require()
调用的页面,最好将这些内容嵌套在require()
调用中以进行配置
多个要求
其次,您正在使用该data-main
属性加载您的配置,该配置定义了库的行为(换句话说,require
/ requirejs
function是自定义的),但是您使用该自定义工具再次加载配置:
我几乎是肯定的,这引入了一些奇怪的行为.
使用paths
以避免../
三,你baseUrl
会自动设置为任意加载它的HTML的位置,或该位置data-main
脚本.您可以通过创建单个入口点(可能js/main
)来使用此优势,然后定义路径配置选项以隐藏嵌套模块.
换句话说,您的应用程序永远不需要请求../
(或其任何变体),因为任何嵌套都应该被路径条目隐藏,如:
"paths": {
"slickModule": "lib/slickModule"
}
我知道这个答案没有具体解决你的问题,但我很肯定其中一个问题 - 纠正后 - 将解决你的404问题.