gpt4 book ai didi

javascript - Typescript 模块导入的相对路径指向错误的目录

转载 作者:行者123 更新时间:2023-11-28 04:31:54 26 4
gpt4 key购买 nike

我有一个用 编写的应用程序层使用 。我还有使用 构建的 Web 资源和 。 Web 资源使用的 html 在必要时包含已编译的 Typescript 代码。我看到的问题是我在 typescript 中使用的相对路径。当我将 Web 资源发布到 Microsoft Dynamics 时,RequireJS 尝试从我的 Typescript 加载相对于 html 文件的相对路径,而不是相对于转译的 Javascript 文件的相对路径。

WebAPI

转换为 build/CCSEQ/WebAPI.js(Model.js 位于 build/CCSEQ/Model.js)

"use strict";

import * as Model from "./Model.js";

export class WebAPI{
// Code here
}

Main.html

位于/WebResources/html/Main.html

<!DOCTYPE html>

<html lang="en">
<head>
<meta charset="utf-8" />
<title>Main</title>
</head>
<body>
<script src="require.js" data-main="../js/Main.js"></script>
</body>
</html>

Main.js

位于/WebResources/js/Main.js

"use strict";

// Require fails because it is looking for /WebResources/html/Model.js rather than /build/CCSEQ/Model.js
require(["WebAPI.js"], function(WebApi){
// Code Here
});

最佳答案

您应该做的第一件事是从模块名称中删除 .js (您的 require 调用和 import语句)。您在 requiredefine 中传递的名称是模块名称。它们看起来像路径,但它们并不是真正的路径。 RequireJS 获取模块名称并使用 mappathsbaseUrl 配置选项(命名最常用的选项)将它们转换为路径。当您不使用这些选项时,它会使用合理的默认值。

如果您在模块名称中使用 .js,RequireJS 会假定您传递的是路径而不是实际的模块名称。 (如果您以斜杠开头字符串,使用类似 (foo?blah) 中的查询参数,或者如果字符串中有冒号,则同样如此,RequireJS 将其视为您正在使用协议(protocol)(例如 http://)。)在这种情况下,没有将模块名称转换为路径,因此 map, pathsbaseUrl 都被忽略。这是 code 的片段:

        //If a colon is in the URL, it indicates a protocol is used and it is just
//an URL to a file, or if it starts with a slash, contains a query arg (i.e. ?)
//or ends with .js, then assume the user meant to use an url and not a module id.
//The slash is important for protocol-less URLs as well as full paths.
if (req.jsExtRegExp.test(moduleName)) {
//Just a plain path, not module name lookup, so just return it.
//Add extension if it is included. This is a bit wonky, only non-.js things pass
//an extension, this method probably needs to be reworked.
url = moduleName + (ext || '');
} else {

req.jsExtRegExp的值为/^\/|:|\?|\.js$/

(您可以将 .js 保留在传递给 data-main 的值中,因为 data-main 很特殊。)

此外,您需要执行一些操作,以便 require(["WebAPI"]... 解析为正确的路径。您可以通过设置RequireJS 配置中的 baseUrl 指向包含文件 WebAPI.js 的目录。或者您可以使用 paths:

paths: {
WebAPI: '../../build/CCSEQ/WebAPI',
}

请注意,WebAPI 键的值也缺少 .js 扩展名。你那里也一定没有它。那里的值是一个路径(不是模块名称),如果你把 .js 放在那里,你会遇到的问题是 RequireJS 会尝试查找带有 .js.js 的文件 扩展!

如果您想了解有关模块名称(又名模块 ID)和路径之间差异的更多信息,我有一个 answer具体内容就到此为止了。

关于javascript - Typescript 模块导入的相对路径指向错误的目录,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44554658/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com