在 Browserify 应用程序中注入数据

Question

这里有人知道如何将数据注入 Browserify 应用程序吗？

我的意思是，我使用 Browserify 创建一个大包 app.js 文件。

但是当我的单页应用程序启动时，服务器还会在加载应用程序的 HTML 页面中添加一些引导数据，这样应用程序就不必向服务器发出 ajax 请求来获取这些数据。

目前，服务器为启动应用程序渲染的 HTML 模板如下所示：

<script type="text/javascript" >
window.bootstrapData = @Html(utils.CustomSerializer.serialize(bootstrapData));
</script>

<script type="text/javascript" src="@{reactAppBaseUrl}/app.js"></script>

在 app.js（Browserified 单页应用程序）内部，我们使用 window.bootstrapData 来获取 Browserify 包中的数据。

有什么不涉及全局变量的优雅方法吗？

Answer 1

使用external require。

捆绑应用时，使用 -r 选项启用特定服务的外部需求：

browserify -r appBootstrap  > app.js

然后，在您已导入捆绑包的下方的脚本标记中，请求服务并注入数据：

<script type="text/javascript" src="@{reactAppBaseUrl}/app.js"></script>

<script>
  var serializedData = @Html(utils.CustomSerializer.serialize(bootstrapData))
  require('appBootstrap').load(serializedData);
</script>