从HTML脚本中使用浏览器中的ES6模块导出

Question

我正在将旧的JavaScript代码转换为ES6模式，并且正在发现许多问题，因为我的旧技术是动态生成许多HTML标签，其中包括这样的标签中的硬编码事件处理程序：

const html = '<input type="text" onclick="doThisOnClick();"/>';
getElementFromID('hostId').innerHTML = html;

这些处理程序在ES6模块中并删除了因为在加载时间没有任何脚本中都没有直接使用它们，也不会通过其他模块代码调用它们。 解决此问题的唯一方法是重新设计我的代码以在生成HTML标签后使用动态事件处理程序注入。必须通过settimeout（）调用来完成此操作。 我一直在尝试发现其他方法，使ES6模块可访问潜在生成的HTML代码。 这是我遇到的一个特定问题：

<script type="module">
  import { deepFunctionUsedByPotentialEventHandler } from './bar.js';
</script>

该网站由Nodejs托管：当地Dev-Server。 我从Chrome中获得了此错误：

htmlFile.html:17 Uncaught SyntaxError: 
The requested module './bar.js' does not provide an export named 
'deepFunctionUsedByPotentialEventHandler ' (at htmlFile.html:17:10)

但是该功能在bar.js中清楚地导出，并在bar.js中定义：

bar.js...
function deepFunctionUsedByPotentialEventHandler() {
  ...
}

export { deepFunctionUsedByPotentialEventHandler, foo, bar };

我怀疑BACAUSE在加载时间没有从模块中剥离的deepfuncunctusBypotentialeventhandhandler的deepfuncunctionBypotentialeventHandler，以使其更快地加载。 。 这不是使用WebPack或任何其他建筑类型工具。

我宁愿通过不使用窗口来保持全局范围清洁。DeepFunctionBypotentialeventhandler。

在我看来，ES6规格应该有一种方法来强制保留代码，例如：

export { foo keep, bar, bob }

我尝试了许多想法，但是到目前为止，我还没有找到一种快速移动的方法来转换此代码。