使用 webpack 2 从 html 文件导入动态生成的脚本答案

【问题标题】：Import dynamically generated script from html file with webpack 2使用 webpack 2 从 html 文件导入动态生成的脚本
【发布时间】：2018-01-13 16:30:07
【问题描述】：

我正在使用 typescript 迁移到 webpack，我有一些脚本像这样动态生成到我的 index.html 中

<script>(function(modules) { code inside ... })</script>

如何将此脚本中的代码（相当直接编译的 typescript 到 javasript 代码）导入我的 main.ts 文件（入口点）？例如

import whateverFunction from 'index.html'

这当然行不通，但我很想看到实现它的正确方法。提前致谢。

【问题讨论】：

是否可以将该部分移动到单独的 JS 文件中？
我不能在单独的文件中。然后脚本由后端更改。
您应该使用 Web API（Ajax 调用）或将数据作为属性添加到一个或多个 HTML 元素来重构您的代码部分。

标签： angularjs typescript webpack webpack-2

【解决方案1】：

如果你在 index.html 上定义了一个变量并且你想在 typescript 中使用它，你需要这样做：

declare var prod: boolean;
declare var version: string;

export class whateverName{
}

您应该使用与 index.html 文件中相同的名称。

【讨论】：

那么，如果我需要从这里使用该类，我将如何从我的打字稿文件中访问它？
我写的代码是你的打字稿文件，两个变量 prod 和 version 是你写在 index.html 文件中的 javascript 变量。