javascript - 将导入语句转换为 Web 路径

Question

我目前正在尝试使用 Web 组件。为此，我安装了一个带有 npm 的软件包，它使用 lit-element(聚合物)将 Bootstrap 引入 Web 组件。

您应该始终只包含您需要的组件:

// e.g import only bs-alert
import 'lit-element-bootstrap/components/alert/bs-alert';

// e.g import all alert components
import 'lit-element-bootstrap/components/alert';

// e.g import all components (should be avoided)
import 'lit-element-bootstrap';

我现在的问题是:如何在网络浏览器中直接使用这些导入语句？因此导入语句必须转换为真实的 Web 路径。因此，我需要一个工具来遍历所有这些依赖项并将它们的导入语句重写为 Web 路径。

我找到了一个可以做到这一点的工具，但它构建了“lit-element-bootstrap”的所有内容，最终我得到了一个 500+ KB 的文件: https://github.com/pikapkg/web

Answer 1

从长远来看，这个问题应该通过 import maps 来解决。这基本上会让浏览器知道 import 'lit-element-bootstrap/ 实际上意味着 import 'path/to/lit-element-bootstrap/。

目前，您需要一台自动更改路径的服务器(例如 polymer serve 或 owc-dev-server，或者您需要应用 build step 。