Javascript Angular 2应用程序网页中的小部件_Javascript_Angular_Webpack_Requirejs

Javascript Angular 2应用程序网页中的小部件

javascript angular webpack requirejs

Javascript Angular 2应用程序网页中的小部件,javascript,angular,webpack,requirejs,Javascript,Angular,Webpack,Requirejs,如果不清楚，让我们再试一次在我的研究中，我了解到有人称之为微型装载机，这正是我试图实现的目标。在webpack配置中，我在plugin部分有这个 new HtmlWebpackPlugin({ template: 'src/index.html', title: METADATA.title, chunksSortMode: 'dependency', metadata: METADATA, inject: 'head' }), 这将在编译过程

如果不清楚，让我们再试一次

在我的研究中，我了解到有人称之为微型装载机，这正是我试图实现的目标。在webpack配置中，我在plugin部分有这个

  new HtmlWebpackPlugin({
    template: 'src/index.html',
    title: METADATA.title,
    chunksSortMode: 'dependency',
    metadata: METADATA,
    inject: 'head'
  }),

这将在编译过程中以如下方式转换html文件，而不使用任何脚本标记（甚至占位符）：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <title>My angular widget</title>

  <meta name="description" content="My angular widget">

  <!-- base url -->
  <base href="/">


<link href="main.23ca1423b5f74b9e7d3a76e9eed69f71.css" rel="stylesheet"><script type="text/javascript" src="polyfills.60dbe827b1b8353af66f.bundle.js" defer></script><script type="text/javascript" src="vendor.0f040ba30b8e909c6a82.bundle.js" defer></script><script type="text/javascript" src="main.d6e9175158901f87b307.bundle.js" defer></script></head>

<body>

  <app class="skin-green gbp">
    Loading...
  </app>




</body>
</html>

这是我提出的一个文件，它做了我想要它做的事情，但每次都需要手工操作，现在使用require.js（但可以是任何东西，我真的不在乎），这是唯一的入口点，在编译过程中自动生成，因此我不必在每次更改和重新部署某些内容时手动更改哈希

--老帖子从这里开始

我有一个angular 2项目，使用webpack进行编译。但我不希望入口点是index.html，因为该应用程序将嵌入到另一个网页中，我无法完全控制该网页

我试图找到一种方法来输出类似于index.html的东西，但是在一个.js文件中，我可以将它包含在网页上

www.some-domain.com/webpage

[...]
<script type="text/javascript" src="https://my-domain.com/angular-widget.js"></script>
<app>
    Loading...
</app>
[...]

[…]
加载。。。
[...]

有没有办法在webpack过程中生成

angular widget.js

？我试图劫持HtmlWebpackPlugin，但这需要输出HTML。我对整个webpack流程相当陌生，但我现在的方法是使用一些模板，在其中我可以输出webpack生成的不同文件，例如使用require.js。但也许整个事情都只有通过网页才能实现

[...]
<script type="text/javascript" src="https://my-domain.com/angular-widget.js"></script>
<app>
    Loading...
</app>
[...]