如何修复此 AMD 路径冲突? [英] How can I fix this AMD path conflict?

问题描述

我正在尝试使用 Esri ArgGis JavaScript API，它是由 Dojo 加载，使用 dojo.require.我有一个现有的模块化 AMD/requirejs Typescript 应用程序，我需要将此代码集成到其中.在初始 TS 文件的顶部，我导入了几个模块:

I am trying to use the Esri ArgGis JavaScript API, which is loaded by Dojo, using dojo.require. I have an existing modular AMD/requirejs Typescript application that I need to integrate this code into. At the top of my initial TS file, I import several modules:

import tracer = module('../classes/trace');
import pubsub = module('../classes/pubsub');
import masker = module('../classes/masker');
// etc.

这工作正常，但现在我已经添加了 ArcGis 代码，而不是在我的应用程序中解析相对路径，require.js 已经从 Esri 站点获取了一个 baseUrl，并尝试加载:

This was working fine, but now that I have added the ArcGis code, instead of resolving the relative path within my application, require.js has picked up a baseUrl from the Esri site, and tries to load:

http://serverapi.arcgisonline.com/jsapi/arcgis/3.3/js/esri/classes/trace.js
// etc.

导致一串 404 响应和脚本错误.

Resulting in a string of 404 responses and script errors.

我该如何解决这个问题?

How can I fix this?

在加载第一个加载模块的文档之前，我尝试在我的 html 文件的头部设置 requirejs baseUrl:

I've tried setting the requirejs baseUrl in the head of my html file before loading the first document that loads modules:

 <script src="http://serverapi.arcgisonline.com/jsapi/arcgis/3.3"></script>
 <script type="text/javascript" src="/content/client/libs/require.js"></script> <!-- data-main="/content/client/hop/hop.app" -->
 <script type="text/ecmascript">
        require.config({
            baseUrl: "/Content/client/hop/"
        });
 </script>
 <script src="~/Content/client/hop/hop.app.js"></script>

但是这失败了，抛出一个需要没有方法配置的异常.

But this fails, throwing an exception that require has no method config.

(注意，如果我颠倒 html 文档头部的顺序，以便 arcgis api 在加载序列中排在最后，那么我会遇到相反的问题——我的本地文件都工作正常，但 dojo 和映射 api 失败，因为它们当他们应该在 argis 服务器上搜索时，他们正在寻找相对于我的站点的路径).

(NB If I reverse the order in the head of the html document so that the arcgis api comes last in the load sequence then I get the opposite problem - my local files all work fine but dojo and the mapping api fail because they are looking for paths relative to my site when they should be searching on the argis server).

推荐答案

我使用 Esri 的 ArcGIS API，所以我遇到了这个确切的问题.这篇来自 dojo 的博文帮了我一些忙.

I work with Esri's ArcGIS API so I've run into this exact problem. This blog post from dojo helped me out some.

第一个问题是 dojo 的配置方式与 requirejs 不同.它查找先前定义的 dojoConfig 以进行设置.第二个是 Esri 的模块加载全部设置为假设有一个基本路径，而您的代码将需要另一个.您将需要一个如下所示的 dojo 配置:

The first issue is that dojo isn't configured the same way requirejs is. It looks for a previously defined dojoConfig to set things up. The second is that Esri's module loading is all set up assuming one basepath, and your code is going to want another. You're going to need a dojo config that looks something like this:

dojoConfig = {
    baseUrl: location.pathname.replace(/\/[^/]+$/, '') + '/Content/client/hop/',  // magic!
    packages: [
        {
            name: 'dojo',
            location: "http://serverapi.arcgisonline.com/jsapi/arcgis/3.3compact/js/dojo/dojo/"
        },
        {
            name: 'dojox',
            location: "http://serverapi.arcgisonline.com/jsapi/arcgis/3.3compact/js/dojo/dojox"
        },
        {
            name: 'esri',
            location: "http://serverapi.arcgisonline.com/jsapi/arcgis/3.3compact/js/esri"
        }
    ]
};

这样做是将基本路径设置回当前 url 加上您的额外内容，然后告诉 dojo esri 的内容在哪里.这些是我遇到的所有包，但如果我错过了一个依赖项，因为它从来没有为我加载过，它将需要一个类似的条目.

What this is doing is setting the basepath back to the current url plus your extra stuff, and then telling dojo where esri's stuff is. Those are all the packages that I've run into but if there's a dependency I missed because it just never loaded for me, it will need a similar entry.

您可能遇到的另一个问题是，如果您习惯于在本地将脚本加载为 file://现在来自另一个域的 dojo 将尝试访问 file://而浏览器将关闭该权限下.从现在开始，您需要在本地 http 服务器上进行测试.在 Windows 上我更喜欢 HFS 和 Linux python 让一切变得简单.

Another problem you might run into is that if you're used to loading your script locally as file:// now dojo from another domain is going to try to access file:// and the browser is going to shut that right down. You'll need to test on a local http server from now on. On Windows I prefer HFS and on Linux python makes it easy.

我希望这会有所帮助.

这篇关于如何修复此 AMD 路径冲突?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！