Nodejs模板引擎marko的使用

Nodejs模板引擎marko的使用
Marko 是一个轻量级、高性能的模板引擎,非常适合在 Node.js 环境中使用。它允许你以类似于 HTML 的方式编写模板,并支持动态内容生成。

安装

首先,你需要安装 Marko:

npm install marko

基本用法

1. 创建一个简单的 Marko 模板

创建一个文件 hello.marko

<!DOCTYPE html>
<html>
<head>
    <title>Hello</title>
</head>
<body>
    <h1>Hello, ${name}!</h1>
</body>
</html>

2. 渲染模板

你可以使用 Node.js 来渲染这个模板:

const marko = require('marko');

// 加载模板
const template = marko.load(require.resolve('./hello.marko'));

// 渲染模板
template.render({ name: 'World' }, (err, output) => {
    if (err) throw err;
    console.log(output);
});

或者,如果你有一个字符串模板:

const marko = require('marko');

const template = marko.compile(`
<!DOCTYPE html>
<html>
<head>
    <title>Hello</title>
</head>
<body>
    <h1>Hello, ${name}!</h1>
</body>
</html>
`);

// 渲染模板
template({ name: 'World' }).then(output => {
    console.log(output);
}).catch(err => {
    console.error(err);
});

高级特性

1. 使用组件

Marko 支持组件化开发,可以让你像在 React 或 Vue 中一样使用组件。

创建一个组件 my-component.marko

<div>
    <h2>${header}</h2>
    <p>${message}</p>
</div>

然后在主模板中使用它:

<my-component header="Welcome" message="This is a component." />

渲染时:

const myComponentTemplate = marko.load(require.resolve('./my-component.marko'));

const data = { header: 'Welcome', message: 'This is a component.' };

myComponentTemplate.render(data).then(output => {
    console.log(output);
}).catch(err => {
    console.error(err);
});

2. 数据绑定

Marko 支持数据绑定,可以在模板中直接使用 JavaScript 表达式:

<p>Today is ${new Date().toLocaleDateString()}</p>

总结

Marko 提供了强大的功能来帮助你在 Node.js 应用中高效地处理模板。通过组件化和数据绑定,它可以极大地提高你的开发效率。希望这些示例能帮助你开始使用 Marko!


3 回复

Marko 是一个轻量级且高效的 Node.js 模板引擎,它允许你以更简单的方式构建动态网页。首先,你需要通过 npm 安装 Marko:

npm install marko

然后,在你的项目中使用它。例如,创建一个 index.marko 文件:

<h1>Hello, <?!= name ?>!</h1>

在你的 Node.js 代码中渲染这个模板:

const marko = require('marko');

const template = marko.load('./index.marko');
const data = { name: 'Marko Polo' };

template.render(data, (err, output) => {
    if (err) throw err;
    console.log(output); // 输出:"<h1>Hello, Marko Polo!</h1>"
});

这样,你就成功地使用了 Marko 来生成动态内容!是不是很简单呢?


Marko 是一个高性能的 Node.js 模板引擎,它旨在帮助开发者更高效地构建动态 Web 页面。下面是如何开始使用 Marko 的步骤和一些基本示例。

安装 Marko

首先,你需要在你的项目中安装 Marko。你可以通过 npm 来安装:

npm install marko --save

创建一个简单的 Marko 模板

假设我们有一个简单的 HTML 文件 index.marko,内容如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Marko Example</title>
</head>
<body>
    <h1>Hello, ${name}!</h1>
    <p>Welcome to the Marko world.</p>
</body>
</html>

在这个模板中,${name} 是一个插值表达式,表示这个位置将会被动态替换。

渲染模板

接下来,我们需要编写一个 Node.js 脚本来渲染这个模板:

const marko = require('marko');

// 读取并编译模板文件
const template = marko.load('./path/to/index.marko');

// 数据对象
const data = {
    name: 'World'
};

// 使用数据渲染模板
template.render(data, (err, output) => {
    if (err) {
        console.error(err);
        return;
    }
    console.log(output);
});

这里,我们首先加载了模板文件,然后定义了一个数据对象 data,最后使用这个数据对象来渲染模板,并将结果输出到控制台。

使用 renderToString 方法

如果你更喜欢使用异步的方式来渲染模板,可以使用 renderToString 方法:

const marko = require('marko');

marko.load('./path/to/index.marko').then(template => {
    const data = {
        name: 'World'
    };

    return template.renderToString(data);
}).then(output => {
    console.log(output);
}).catch(err => {
    console.error(err);
});

这段代码与之前的例子功能相同,但是使用了异步的方式来进行模板的渲染。

这些就是使用 Marko 基本的步骤和方法。你可以根据需要调整模板的内容和逻辑。希望这对你有所帮助!

Marko 是一个高性能的 Node.js 模板引擎。首先,通过npm安装:npm install marko。然后,在项目中引入并创建模板:

const marko = require('marko');

const template = marko.load('./path/to/template.marko');

接着,使用模板的数据对象进行渲染:

const data = { title: 'Hello', name: 'Marko' };

template.render(data, (err, output) => {
  if (err) throw err;
  console.log(output);
});

在模板文件(.marko)中,你可以像写HTML一样书写,同时可以嵌入JavaScript逻辑。

回到顶部