教程：如何使用Leaf
还可以学习叶子-一种可轻松生成视图的模板语言！
您可以在github上找到本教程的结果
本教程是如何设置Vapor 3项目的自然后续。 您可以先阅读该教程然后再回来，也可以跳过并继续阅读😊
指数
1.创建一个新项目
2.生成Xcode项目
3.配置您的项目以使用Leaf
4.创建您的第一个模板/视图
5.实施服务视图的路线
6.奖金：将数据传递到视图
7.从这里去哪里
1.创建一个新项目
蒸气工具箱非常好，让您可以使用任何git-repo作为模板轻松创建新项目。 由于我们将基于上述教程的结果，因此我们将使用它作为模板来创建一个新项目：
蒸气新项目名称--template = vaporberlin / my-first-route
注意：您可以通过在终端中输入vapor –help来查看蒸气工具箱的全部功能。
我们的命令将使用来自vaporberlin的 my-first-route作为模板创建一个名为projectName的项目（感谢vapor toolbox🤛🏻）。
2.生成Xcode项目
在生成Xcode项目之前，我们必须添加Leaf作为依赖项，并在Package.swift中更改包名称：
// swift-tools-version：4.0
导入PackageDescriptionlet包=包（
名称：“ projectName”，//已更改
依赖项：[
.package（URL：“ https://github.com/vapor/vapor.git”，来自：“ 3.0.0”），
.package（URL：“ https://github.com/vapor/leaf.git”，来自：“ 3.0.0”）//添加
]，
目标：[
.target（name：“ App”，依赖项：[“ Vapor”， “ Leaf” ]），
.target（name：“ Run”，依赖项：[“ App”]），
.testTarget（name：“ AppTests”，依赖项：[“ App”]），
]
）
现在在终端的根目录projectName /上执行：
蒸气更新-y
可能需要一些时间来获取依赖关系，生成Xcode项目并为您打开它。 但是完成后，您应该具有以下项目结构：
项目名/
├──Package.swift
├──资料来源/
│├──App /
││├──app.swift
││├──boot.swift
││├──configure.swift
││└──route.swift
│└──运行/
│└──main.swift
├──测试/
├──公众/
├──依存关系/
└──产品/
如果在cmd + r时看到包含“ CNIOOpenSSL ”的错误，则说明缺少依赖项。 只需运行Brew 升级程序并重新生成项目即可
3.配置您的项目以使用Leaf
我们将必须在configure.swift中注册LeafProvider ：
进口蒸气
import Leaf //添加了公共功能configure（
_ config：inout Config，
_ env：inout环境，
_服务：inout服务
）抛出{//注册到路由器的路由
让路由器= EngineRouter.default（）
尝试路线（路由器）
services.register（router，as：Router.self） let leafProvider = LeafProvider（）//添加
尝试services.register（leafProvider）//添加了 config.prefer（LeafRenderer.self，for：ViewRenderer.self）
}
还要将LeafRenderer设置为我们首选的ViewRenderer🍃
这将使我们能够非常轻松地从路线内访问渲染器。
4.创建您的第一个模板/视图
我们的视图渲染器叶子期望一个名为Resources /的目录，并在其下一个名为Views /的目录中包含所有视图文件。 因此，您最终将获得如下所示的文件夹结构：
项目名/
├──Package.swift
├──资料来源/
│├──App /
││├──app.swift
││├──boot.swift
││├──configure.swift
││└──route.swift
│└──运行/
│└──main.swift
├── 资源/
│└── 意见/
├──测试/
├──公众/
├──依存关系/
└──产品/
注意：它们必须是目录（蓝色），而不是组（黄色）。 我在终端中使用mkdir -p资源/视图/创建了它们
为了让Xcode 看到您的新目录，您可能必须使用蒸气xcode -y重新生成Xcode项目。 在Resources / Views /中完成后，使用以下代码创建一个名为welcome.leaf的新文件：
叶子
欢迎来到我的第一个叶子模板！
注意：选择welcome.leaf并转到编辑器>语法着色> HTML😉
5.实施服务视图的路线
在您的routes.swift中添加一条新路线，并将其命名为.. hmmm ..🤔
导入Vaporpublic功能路径（_路由器：路由器）抛出{router.get（“ name”）{要求
返回“伊桑·亨特”
} router.get（“ age”）{要求
返回23
} router.get（“ json”）{要求
返回人员（姓名：“ Martin J. Lasek”，年龄：26岁）
} router.get（“ view”）{req- > Future 在
返回尝试req.view（）。render（“ welcome”）
}
}结构人：内容{
变量名称：字符串
变量年龄：整数
}
函数req.view（）创建并返回一个ViewRenderer。 并且由于我们将LeafRenderer配置为ViewRenderer，因此我们可以使用.leaf文件。
如果现在按cmd + r或Xcode顶部的播放按钮，它将启动应用程序。 Xcode中的控制台会告诉您在哪里 。 对我来说，它是localhost：8080 。
如果现在在浏览器中启动localhost：8080 / view ，您将获得使用Leaf作为模板语言的视图！ 🙌🏻
6.奖金：将数据传递到视图
将数据传递到视图中非常容易。 这是这样的：
导入Vaporpublic功能路径（_路由器：路由器）抛出{router.get（“ name”）{要求
返回“伊桑·亨特”
} router.get（“ age”）{要求
返回23
} router.get（“ json”）{要求
返回人员（姓名：“ Martin J. Lasek”，年龄：26岁）
} router.get（“ view”）{req-> Future 在
返回尝试req.view（）。render（“ welcome”）
} router.get（“ bonus”）{要求-> Future 在
let data = [“名称”：“伊桑”，“年龄”：“ 26”]
返回尝试req.view（）。render（“ whoami”，数据）
}
}结构人：内容{
变量名称：字符串
变量年龄：整数
}
如果现在在Resources / Views /中创建一个名为whoami.leaf的新文件，则可以像这样访问其中传递的数据：
叶子
您统治＃（名字）！ 不敢相信你已经＃（年龄）！
如果您拥有符合内容的类或结构，则还可以将其实例传递给视图，如下所示：
导入Vaporpublic功能路径（_路由器：路由器）抛出{router.get（“ name”）{要求
返回“伊桑·亨特”
} router.get（“ age”）{要求
返回23
} router.get（“ json”）{要求
返回人员（姓名：“ Martin J. Lasek”，年龄：26岁）
} router.get（“ view”）{req-> Future 在
返回尝试req.view（）。render（“ welcome”）
} router.get（“ bonus”）{req-> Future 在
让开发人员=人员（名称：“马丁”，年龄：26）
返回尝试req.view（）。render（“ whoami”， 开发人员 ）
}
}结构人：内容{
变量名称：字符串
变量年龄：整数
}
现在重新运行您的应用程序并启动localhost：8080 / bonus🚀
而已！ 您已成功实现了叶模板项目🎉！
7.从这里去哪里
您可以在Github上找到包含示例项目的所有教程的列表：
👉🏻https://github.com/vaporberlin/vaporschool
我很高兴您阅读我的文章！ 如果您有任何建议或改进，请告诉我！ 我希望收到您的来信！ 😊
