浏览器中的ES模块路径别名

Question

我想以方便的方式在browser环境中使用ES模块：

import React from 'react';
import ReactDOM from 'react-dom';
import Component from '../componens/Component';

我希望将react解析为../vendors/react.js，react-dom解析为../vendors/react-dom.js或https://some.cdn/react-dom.min.js。仅使用本机浏览器方法，如何不使用捆绑软件来进行此操作？

Answer 1

目前尚无标准，但有one is under way（Github存储库here）。有了这个建议，您将有一个script和type="importmap"列出了别名，如下所示：

{
  "imports": {
    "react": "../vendors.react.js",
    "react-dom": "https://some.cdn/react-dom.min.js"
  }
}

请注意，相对路径（例如第一个示例中的相对路径）是相对于此script出现在文档中的，而不是相对于使用别名的模块。

Chrome在v74中对此进行了试用。它的Chrome platform status page列出了（到目前为止）其他供应商的“没有公开信号”。