示例:导入映射模拟


【Example: import maps emulation】

给定导入映射:

【Given an import map:】

{
  "imports": {
    "react": "./app/node_modules/react/index.js"
  },
  "scopes": {
    "./ssr/": {
      "react": "./app/node_modules/server-side-react/index.js"
    }
  }
} 
{
  "dependencies": true,
  "scopes": {
    "": {
      "cascade": true,
      "dependencies": {
        "react": "./app/node_modules/react/index.js"
      }
    },
    "./ssr/": {
      "cascade": true,
      "dependencies": {
        "react": "./app/node_modules/server-side-react/index.js"
      }
    }
  }
} 

导入映射 假设你可以默认获取任何资源。这意味着策略顶层的 "dependencies" 应设置为 true。策略要求这是可选的,因为它会启用应用的所有资源的跨链接,这在许多场景下没有意义。它们还假设任何给定范围都可以访问其允许依赖之上的任何范围;所有模拟导入映射的范围必须设置 "cascade": true

导入映射只有一个顶层作用域用于它们的“imports”。所以要模拟“imports”,请使用“”作用域。要模拟“scopes”,可以以类似于导入映射中“scopes”的方式使用“scopes”。

【Import maps only have a single top level scope for their "imports". So for emulating "imports" use the "" scope. For emulating "scopes" use the "scopes" in a similar manner to how "scopes" works in import maps.】

注意事项:策略不会对范围的各种查找使用字符串匹配。它们会进行 URL 遍历。这意味着像 blob:data: 这样的 URL 在两个系统之间可能无法完全互操作。例如,导入映射可以通过在 / 字符处分割 URL 来部分匹配 data:blob: URL,而策略则故意不能这样做。对于 blob: URL,导入映射范围不会采用 blob: URL 的源。

【Caveats: Policies do not use string matching for various finding of scope. They do URL traversals. This means things like blob: and data: URLs might not be entirely interoperable between the two systems. For example import maps can partially match a data: or blob: URL by partitioning the URL on a / character, policies intentionally cannot. For blob: URLs import map scopes do not adopt the origin of the blob: URL.】

此外,导入地图只在“导入”状态下工作,因此可能需要添加一个 所有依赖映射的“导入”条件。

【Additionally, import maps only work on import so it may be desirable to add a "import" condition to all dependency mappings.】