Vercel后缀斜杠trailingSlash #

一、vercel.json配置机制 #

vercel提供一种通用配置机制，在项目根目录放置一个vercel.json文件，就能对vercel容器行为进行各种配置（甚至包括rewrite等）。

如下面的配置，是将没有后缀斜线URL的访问请求，都默认追加上/。

{
    "trailingSlash": true 
}
// doc.toast.pub/foo 会转发至 doc.toast.pub/foo/
// 但doc.toast.pub/foo.css会安全保持原样

二、图片相对地址计算错误 #

起因是ToastDoc在vercel部署好之后，一篇文档里的图片一会正常一会报错。
最后是发现是访问网页的URL不同。

" 图片正常时的URL
https://doc.toast.pub/articles/docs/hugo/hugo-book-multilang-search/

" 图片报错时的URL
https://doc.toast.pub/articles/docs/hugo/hugo-book-multilang-search

第一个URL结尾多了一个斜线，而我文章里的图片地址用的是相对路径：

<img src="./toast.webp" />

有没有后缀斜杠，直接影响了相对路径的解析

前者图片解析地址（正确）:
doc.toast.pub/articles/docs/hugo/hugo-book-multilang-search/toast.webp

后者图片解析地址（错误）：
doc.toast.pub/articles/docs/hugo/toast.webp 

三、TrailingSlash圣战 #

原理简单不啰嗦。一般得配置http server的rewrite，而vercel提供了很棒的配置入口:vercel.json。

过程发现关于TrailingSlash的规范问题在前端技术里是容易撕起来的话题。在hugo社区围观了两个大神讨论，以及google也表达过好几次。

非web技术，不熟悉就不选边站了，后面详细了解讨论(对撕)过程。
先用相对地址书写更简单，先选择配置trailingSlash

• 编辑器圣战: Vim vs Emacs
• 代码风格圣战: Tab vs Blank
• Web圣战: TrailingSlash vs Trimmed Slash