requirejs + bower,bower 组件中的路径和依赖项
requirejs + bower, paths and dependencies within bower components
我已经做了很多研究,但找不到我要找的答案,所以就这样吧。
我有一个 Bower 组件,它有自己的依赖项:
/vendor/bower_components/my_module/my_module.js
/vendor/bower_components/my_module/dependency_1.js
/vendor/bower_components/my_module/dependency_2.js
在 my_module.js 内部,它使用相对路径加载其依赖项:
define(["./dependency_1", "./dependency_2"], function (dep1, dep2) { ... });
但是当我的 requirejs config.paths 设置好后:
paths: {
my_module: "/vendor/bower_components/my_module/my_module"
}
... 现在相对路径是相对于基本 requirejs 路径的,而不是 my_module 的完整路径。我明白为什么会这样(因为模块 id 不再是完整路径,而是缩短的名称),我只是不知道如何解决它。我很确定 packages 是正确的方向,我只是运气不好。我该怎么办? my_module
顺便说一句,是第三方模块,不想对其进行编辑。谢谢。
更新 - 我的应用程序中的代码使用示例:
场景 1(没有 config.paths
):
define(["/vendor/bower_components/my_module/my_module"], function(myModule) {
// This works. No issues here.
// The reason this works is because the module ID for myModule is:
// "/vendor/bower_components/my_module/my_module"
// Therefore, the relative paths "./dependency_1" and "./dependency_2"
// are resolved against that module ID.
});
场景 2 - 现在 my_module 在 config.paths 中定义(见上文):
define(["my_module"], function(myModule) {
// Error, cannot load files dependency_1.js or dependency_2.js
// This is because relative paths are resolved against a module's ID.
// Now the module ID is "my_module", not "/vendor/bower_components/my_module/my_module"
// As such, the paths for ./dependency_1 and ./dependency_2 are resolved against "/"
});
不幸的是(或者不是?)这是设计使然:http://requirejs.org/docs/api.html#modulenotes-relative-names。我们应该能够使用包来解决这个问题。我只是想知道是否有人知道如何执行此操作。
这就是我目前对你的问题的了解。你可以用这些配置做你想做的(或不做?):
require.config({
packages: [
{
name: "myModule"
location: '/vendor/bower_components/my_module/',
main: "my_module"
}
// [name option] can be anything you want
// [main option] pointing to your main js file of the package
// if you rename your mymodule.js to main.js you no longer need to config the [main option]
]
});
在你的 my_module.js
define(["./dependency_1", "./dependency_2"], function (dep1, dep2) {
// ...
});
你可以这样称呼你的 my_module.js。
define(["myModule"], function(myModule) {
// ...
});
有关更多信息,您可以查看此 link Common-config#packages
我已经做了很多研究,但找不到我要找的答案,所以就这样吧。
我有一个 Bower 组件,它有自己的依赖项:
/vendor/bower_components/my_module/my_module.js /vendor/bower_components/my_module/dependency_1.js /vendor/bower_components/my_module/dependency_2.js
在 my_module.js 内部,它使用相对路径加载其依赖项:
define(["./dependency_1", "./dependency_2"], function (dep1, dep2) { ... });
但是当我的 requirejs config.paths 设置好后:
paths: {
my_module: "/vendor/bower_components/my_module/my_module"
}
... 现在相对路径是相对于基本 requirejs 路径的,而不是 my_module 的完整路径。我明白为什么会这样(因为模块 id 不再是完整路径,而是缩短的名称),我只是不知道如何解决它。我很确定 packages 是正确的方向,我只是运气不好。我该怎么办? my_module
顺便说一句,是第三方模块,不想对其进行编辑。谢谢。
更新 - 我的应用程序中的代码使用示例:
场景 1(没有 config.paths
):
define(["/vendor/bower_components/my_module/my_module"], function(myModule) {
// This works. No issues here.
// The reason this works is because the module ID for myModule is:
// "/vendor/bower_components/my_module/my_module"
// Therefore, the relative paths "./dependency_1" and "./dependency_2"
// are resolved against that module ID.
});
场景 2 - 现在 my_module 在 config.paths 中定义(见上文):
define(["my_module"], function(myModule) {
// Error, cannot load files dependency_1.js or dependency_2.js
// This is because relative paths are resolved against a module's ID.
// Now the module ID is "my_module", not "/vendor/bower_components/my_module/my_module"
// As such, the paths for ./dependency_1 and ./dependency_2 are resolved against "/"
});
不幸的是(或者不是?)这是设计使然:http://requirejs.org/docs/api.html#modulenotes-relative-names。我们应该能够使用包来解决这个问题。我只是想知道是否有人知道如何执行此操作。
这就是我目前对你的问题的了解。你可以用这些配置做你想做的(或不做?):
require.config({
packages: [
{
name: "myModule"
location: '/vendor/bower_components/my_module/',
main: "my_module"
}
// [name option] can be anything you want
// [main option] pointing to your main js file of the package
// if you rename your mymodule.js to main.js you no longer need to config the [main option]
]
});
在你的 my_module.js
define(["./dependency_1", "./dependency_2"], function (dep1, dep2) {
// ...
});
你可以这样称呼你的 my_module.js。
define(["myModule"], function(myModule) {
// ...
});
有关更多信息,您可以查看此 link Common-config#packages