Skip to content

EdgeJS

Edge 是一个简单现代功能齐全的模板引擎,由 AdonisJS 核心团队为 Node.js 创建和维护。Edge 类似于编写 JavaScript。如果您了解 JavaScript,您就了解 Edge。

TIP

Edge 的文档可在 https://edgejs.dev 上获取

安装

使用以下命令安装和配置 Edge。

sh
node ace add edge

:::disclosure

  1. 使用检测到的包管理器安装 edge.js 包。

  2. adonisrc.ts 文件中注册以下服务提供器。

    ts
    {
      providers: [
        // ...其他提供器
        () => import('@adonisjs/core/providers/edge_provider')
      ]
    }

:::

渲染您的第一个模板

配置完成后,您可以使用 Edge 渲染模板。让我们在 resources/views 目录中创建一个 welcome.edge 文件。

sh
node ace make:view welcome

打开新创建的文件,并在其中写入以下标记。

edge
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
</head>
<body>
  <h1>
    来自 {{ request.url() }} 端点的 Hello world
  </h1>
</body>
</html>

最后,让我们注册一个路由来渲染模板。

ts
import router from '@adonisjs/core/services/router'

router.get('/', async ({ view }) => {
  return view.render('welcome')
})

您也可以使用 router.on().render 方法来渲染模板,而无需为路由分配回调函数。

ts
router.on('/').render('welcome')

向模板传递数据

您可以通过将对象作为第二个参数传递给 view.render 方法来向模板传递数据。

ts
router.get('/', async ({ view }) => {
  return view.render('welcome', { username: 'romainlanz' })
})

配置 Edge

您可以通过在 start 目录中创建一个预加载文件来使用 Edge 插件或向 Edge 添加全局助手。

sh
node ace make:preload view
ts
// title: start/view.ts
import edge from 'edge.js'
import env from '#start/env'
import { edgeIconify } from 'edge-iconify'

/**
 * 注册插件
 */
edge.use(edgeIconify)

/**
 * 定义全局属性
 */
edge.global('appUrl', env.get('APP_URL'))

全局助手

请查看 Edge 助手参考指南以查看 AdonisJS 贡献的助手列表。

了解更多