RIOT.JS - 环境设置
有两种方法可以使用 RIOT js。
本地安装 − 您可以在本地机器上下载 RIOT 库并将其包含在 HTML 代码中。
基于 CDN 的版本 −您可以直接从内容分发网络 (CDN) 将 RIOT 库包含到您的 HTML 代码中。
本地安装
转到 https://v3.riotjs.vercel.app/download/ 下载最新版本。
现在将下载的 riot.min.js 文件放在您网站的目录中，例如 /riotjs。
示例
现在您可以在 HTML 文件中按如下方式包含 riotjs 库 −
<!DOCTYPE html>
<html>
<head>
<script src = "/riotjs/riot.min.js"></script>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/riot/3.13.2/riot+compiler.min.js"></script>
</head>
<body>
<messageTag></messageTag>
<script>
var tagHtml = "<h1>Hello World!</h1>";
riot.tag("messageTag", tagHtml);
riot.mount("messageTag");
</script>
</body>
</html>
这将产生以下结果 −
基于 CDN 的版本
您可以直接从内容分发网络 (CDN) 将 RIOT js 库包含到您的 HTML 代码中。Google 和 Microsoft 提供最新版本的内容分发。
注意 − 我们在本教程中始终使用 CDNJS 版本的库。
示例
现在让我们使用 CDNJS 中的 jQuery 库重写上述示例。
<!DOCTYPE html>
<html>
<head>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/riot/3.13.2/riot+compiler.min.js"></script>
</head>
<body>
<messageTag></messageTag>
<script>
var tagHtml = "<h1>Hello World!</h1>";
riot.tag("messageTag", tagHtml);
riot.mount("messageTag");
</script>
</body>
</html>
这将产生以下结果 −
