什么是mappings.ts文件，应如何在Tritium中进行设置？

Question

我正在使用Moovweb SDK和Tritium。 我希望我的移动网站的行为类似于我的桌面网站。 我有指向我主页的不同URL。 我应该使用正则表达式吗？ 一个共同的要素？ 匹配路径的最佳语法是什么？

Answer 1

脚本目录中的mappings.ts文件是匹配特定页面的位置。 该文件被导入html.ts中，并允许我们说“当某个页面匹配时，进行以下转换”。

大多数项目已经生成了映射文件。 一个简单的布局将是这样的：

match($path) {
  with(/home/) {
    log("--> Importing pages/homes.ts in mappings.ts")
    @import pages/home.ts
  }
}

每次您开始在新页面上工作时，都需要设置一个新的“地图”。

第一：匹配唯一路径

上面的Tritium与首页的路径匹配。 路径是域后的URL位。 例如，在www.example.com/search/item中，“ www.example.com”是域，而“ search / item”是路径。

< >/home/< >用正则表达式指定“ home”部分。 如果需要，您还可以使用纯字符串：

with（“ home”）如果Tritium将路径与匹配器匹配，它将导入主页。

网站的首页实际上并不包含“家”这个词，这很可能是事实。 大多数首页是没有任何匹配项的URL。 更好的字符串匹配器可以是：

match($path) {
  with ("/")
}

或者，使用正则表达式：

with(/index|^\/$/) {

如您所见，映射文件的< >with()< >函数是真正可以使用Regex的地方。 查看我们关于正则表达式的简短指南。 有时会更简单，例如< >(/search/)< >。

切记要想出URL中最独特的方面。 如果两个< >with()< >函数匹配相同的URL，则将使用映射文件中最先出现的那个。 如果找不到用于不同页面类型的唯一URL匹配器，则可能必须通过其他方式进行匹配。

为什么使用正则表达式？

使用字符串而不是使用正则表达式匹配器似乎更容易。 但是，正则表达式在匹配URL方面提供了更大的灵活性。

例如，站点可以在其产品页面URL中使用数字字符串。 使用普通的字符串匹配器不切实际-您必须列出站点上所有项目可能的所有数字。 一种更简单的方法是使用正则表达式说：“如果有5位数字的字符串，请继续！” （用于匹配5位数字的代码：< >/\\d{5}/< >。）

第二：记录比赛

匹配特定路径时，还应使用< >log()< >语句，以便确切了解要导入的内容。 log语句将打印在命令行窗口中，因此您可以查看正则表达式是否与您的路径精确匹配。

match($path) {
  with(/index|^\/$/) {
    log("--> importing pages/home.ts in mappings.ts")
  }
}

第三：导入文件

最后，使用< >@import< >函数来包含特定于页面的file文件。

match($path) {
  with(/index|^\/$/) {
    log("--> importing pages/home.ts in mappings.ts")
    @import pages/home.ts
  }
}