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

Question

我想以方便的方式在浏览器环境中使用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

目前尚无标准，但是{​​{3}}（Github存储库one is under way。）根据该建议，您将有一个script和type="importmap"列出别名，例如：

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

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

Chrome从v74开始对其进行了试用，它背后是您必须启用的标志：chrome://flags/#enable-experimental-productivity-features。 here列出了其他供应商（到目前为止）“没有公开信号”。