javascript - 使用 javascript 作为快速 View 引擎

Question

在我的 React 应用程序中，我目前将 hbs 设置为 View 引擎。我的 Views 文件夹有几个 hbs 文件。

我的应用程序 js 中现在有以下内容

// View engine
app.engine(
  'hbs',
  hbs({
    extname: 'hbs',
  })
)

app.set('view engine', 'hbs')

问题: 我想使用一个 UI 框架，例如 Material UI。我需要能够使用如下语句:

import Button from '@material-ui/core/Button';

我认为这在 Handlebars 中是不可能的。所以我需要将所有 View 切换到 javascript。如何摆脱 hbs 并在页面的 View 文件夹中使用 javascript？

这是我的示例家庭 hbs View :

{{> nHeader }}



 <div class="fullscreen_cover cover1">
    <div class="welcomer">
        <h1 class="mb-3 lead">
            This is my home page
        </h1>

    </div>
  </div>


{{> footer }}

Answer 1

你不能这样做，因为这是不可能的。您真正想要的是提供一个带有关联包的 HTML 文件作为 <script>标记这是你的 react 应用程序。

然后用户加载这个 html 文件和 JS 文件。 JS 包是您的 React 应用程序，它负责在您的应用程序状态更新时重新呈现 DOM。

对于捆绑，您应该使用类似 webpack 的东西.