2

在多页 Web 应用程序项目中，服务器部分在 Node.js 和 Express 上运行。Marko 用作服务器端渲染的模板引擎。例子 ：

<h1>${ out.global.__('user.title') } </h1>

<form action="" method="POST">
  <input type="text" name="firstname" value=(out.global.req.body.firstname || '')>
  <if(out.global.err.firstname)>
    <span class="error">$!{ out.global.err.firstname}</span>
  </if>
</form>

我需要添加 JavaScript 交互客户端（目前没有 JS）。需要通过保持多页表单来添加客户端JS，这意味着没有单页应用程序。

目标是使用 Marko 在服务器端编译和生成视图，然后将其发送到浏览器，在浏览器中 Vue 将“水合”HTML 以增加交互性。我不知道如何编写服务器端。

（我知道我们可以使用 Vue.js 或 Marko 作为同构/通用 Web 应用程序（服务器端渲染和客户端渲染的“相同”代码/库），但这不是问题）

我已经添加了一个html-elements.json允许我的 Vue 组件标签与 Marko。但即便如此，我还是不明白这两个模板引擎的语法是如何一起工作而不是“冲突”的。如果我做 ：

<h1>${ out.global.__('user.title') } </h1>

<form action="" method="POST">
  <input v-model="firstname" :type="type" name="firstname" value=(out.global.req.body.firstname || '')>
  <if(out.global.err.firstname)>
    <span class="error">$!{ out.global.err.firstname}</span>
  </if>
</form>

这v-model将起作用，但:type快捷方式会使 Marko 编译器崩溃。这是一个例子，但可能有很多。看起来在 Marko 文件中编写 Vue.js 语法不是解决方案。

我想知道是否可以通过保持 marko 服务器端将 Vue.js 添加到项目客户端，如果可以，从哪里开始/如何做？

希望这很清楚，提前感谢您的帮助。

4

0 回答 0