# 主题列表预览（TLP）

**URL:** https://meta.discourse.org/t/topic-list-previews-tlp/209973
**Category:** Theme component
**Created:** [2021年十一月23日 12:25 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973 "2021-11-23T12:25:59Z")
**Posts on this page:** 20
**Page:** 37

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2026年七月14日 12:47 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/737 "2026-07-14T12:47:56Z")

</div>

几项非常不错的优化：

这项优化去除了 imagesLoaded 库，因为该库过于笨重，现在我们使用原生系统来实现相同的功能：

> <https://github.com/merefield/discourse-tc-topic-list-previews/pull/67>

这项优化消除了滚动时新集合第一张卡片上因冲突且不必要的核心高亮动画而导致的意外卡顿，这种卡顿让人误以为真正背景色的加载需要时间（其实只是 CSS 的问题）：

> <https://github.com/merefield/discourse-tc-topic-list-previews/pull/68>

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2026年七月14日 16:25 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/739 "2026-07-14T16:25:57Z")

</div>

赞助商（\>= 7美元/月）现在应该可以再次访问 sidecar。

如果您已经通过这种方式设置了 discourse-locations-early-access，请使用相同的技术克隆 sidecar - 如有任何问题，请私信我！

如果您是新的赞助商，想知道如何获取 sidecar 的访问权限，请私信我！

**注意：主题组件将保持公开。**

---

<div class="post-metadata">

### Author: ![Jagster](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jagster/32/192154_2.png) [@Jagster](https://meta.discourse.org/u/Jagster)
#### Post date: [2026年七月14日 17:10 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/740 "2026-07-14T17:10:37Z")

</div>

这个组件和 `https://github.com/merefield/discourse-topic-list-previews-theme.git` 是同一个吗？后者是否是已停用的 URL？

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2026年七月14日 17:12 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/741 "2026-07-14T17:12:39Z")

</div>

[GitHub - merefield/discourse-tc-topic-list-previews: Enriches the content and layout of topic lists · GitHub](https://github.com/merefield/discourse-topic-list-previews-theme.git) 仍然是公开的，我也没有计划更改这一状态——这是正确的 URL，且未发生过变更。

---

<div class="post-metadata">

### Author: ![Moin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/moin/32/554653_2.png) [@Moin](https://meta.discourse.org/u/Moin)
#### Post date: [2026年七月14日 17:15 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/742 "2026-07-14T17:15:07Z")

</div>

我想在某个时候这个仓库被重命名了。但只要 merefield 不使用旧名称创建新仓库，这应该不成问题。

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2026年七月14日 17:16 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/743 "2026-07-14T17:16:44Z")

</div>

是的，主题组件曾在某个时候更换了组织（从 Pavilion 转出）。

原来的插件变成了 sidecar，在这个过程中，前端被移除并移到了主题组件中。

本质上，这现在是一个免费增值模式——那些不需要 sidecar 功能的用户可以继续正常使用。

清楚得像泥巴一样吗？😅

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2026年七月17日 11:41 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/744 "2026-07-17T11:41:29Z")

</div>

更新：为了避免构建失败，我已将 sidecar 的公共版本恢复至：

`https://github.com/merefield/discourse-topic-previews-sidecar`

但请注意，该版本现已不再提供支持，请尽快移除。

现在有一条新的管理员通知。

对于每月赞助金额 \>= 7 美元的 GitHub 赞助者，如果您希望获得受支持版本的访问权限，请私下联系我。

---

<div class="post-metadata">

### Author: ![Eviepayne](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eviepayne/32/352733_2.png) [@Eviepayne](https://meta.discourse.org/u/Eviepayne)
#### Post date: [2026年七月20日 15:57 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/745 "2026-07-20T15:57:42Z")

</div>

我注意到在主题列表页面上有一个bug，有时候书签按钮在不应该高亮的时候被高亮了：  
 ![image](https://global.discourse-cdn.com/meta/original/4X/f/6/2/f623d70291ac6e02eaf1f6c0a66df3d165e4c820.png)

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2026年七月20日 18:40 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/746 "2026-07-20T18:40:37Z")

</div>

请更新到私有 sidecar @Eviepayne，然后我们再继续。详情见私信。

---

<div class="post-metadata">

### Author: ![Eviepayne](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eviepayne/32/352733_2.png) [@Eviepayne](https://meta.discourse.org/u/Eviepayne)
#### Post date: [2026年七月20日 23:18 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/747 "2026-07-20T23:18:17Z")

</div>

那个问题消失了，但我在管理仪表板中看到了这个：

 ![image](https://global.discourse-cdn.com/meta/original/4X/e/1/3/e1352a6f52d69d505a7ac867a13d343e83c7947a.png)

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2026年七月21日 11:16 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/748 "2026-07-21T11:16:25Z")

</div>

我认为这是由现已缺失的旧版 Sidecar 排入队列的，因此您可以忽略并关闭它。

---

<div class="post-metadata">

### Author: ![satonotdead](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/satonotdead/32/447830_2.png) [@satonotdead](https://meta.discourse.org/u/satonotdead)
#### Post date: [2026年七月27日 15:43 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/749 "2026-07-27T15:43:39Z")

</div>

是否支持 Horizon，或者未来有可能支持吗？🙂

---

<div class="post-metadata">

### Author: ![Ed\_S](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/ed_s/32/134015_2.png) [@Ed\_S](https://meta.discourse.org/u/Ed_S)
#### Post date: [2026年七月29日 12:58 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/750 "2026-07-29T12:58:30Z")

</div>

> [@satonotdead](#):
>
> 是否支持 Horizon

我在想，这会不会就是我看到那个大红横幅的原因？

> **⚠ 发生错误。您的网站可能无法正常工作。  
> 由“主题列表预览”引起。[点击此处](https://meta.discourse.org/admin/customize/themes/4?safe_mode=no_themes)进行更新、重新配置或禁用。**

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2026年七月29日 13:11 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/752 "2026-07-29T13:11:03Z")

</div>

不，它们不兼容，因为 Horizon 有自己使用 Transformer 的方式来修改列等内容，因此存在根本性冲突。

---

<div class="post-metadata">

### Author: ![Ed\_S](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/ed_s/32/134015_2.png) [@Ed\_S](https://meta.discourse.org/u/Ed_S)
#### Post date: [2026年七月29日 13:54 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/753 "2026-07-29T13:54:16Z")

</div>

我并没有使用 Horizon——刚刚确认过了。我使用的是带有主题预览功能的 Light 主题作为默认设置，另外还有两个用户可选的选项，分别是带有主题预览功能的 Dark 主题和 Light（简约）主题。

我与 TLP 存在不兼容问题吗？它似乎仍在正常运行。但那个醒目的红色横幅（仅管理员可见）确实让人有点不安。

我使用的是 esr 版本流（2026.7.0）

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2026年七月29日 16:01 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/754 "2026-07-29T16:01:54Z")

</div>

浏览器控制台中是否有异常？

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2026年七月29日 16:16 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/755 "2026-07-29T16:16:59Z")

</div>

仅供参考，我确实发现了一些小故障，已经移除并“送它们出门”了，希望它们是同一问题：

> <https://github.com/merefield/discourse-tc-topic-list-previews/pull/69>
>
> \- Makes topic-list preview transformers fail-safe when optional topic fields are… missing.
> - Prevents errors when topic.thumbnails, topic.tags, or topic.dominant\_colour are absent.
> - Adds helper methods for dominant-color presence checks.
> - Keeps the CSS Grid Lanes fallback console.warn, with a narrow ESLint suppression.
> - Updates the initializer to current apiInitializer(...) style via lint autofix.

请更新并确认问题是否已解决。如果未解决，请分享任何控制台错误（在旧版浏览器上可能会出现警告）

---

<div class="post-metadata">

### Author: ![Ed\_S](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/ed_s/32/134015_2.png) [@Ed\_S](https://meta.discourse.org/u/Ed_S)
#### Post date: [2026年七月29日 16:28 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/756 "2026-07-29T16:28:26Z")

</div>

谢谢 - 问题已解决！

为了记录，在更新之前：

> TLP：您的浏览器不支持 CSS Grid Lanes。主题列表预览将回退到标准网格布局近似值以实现瀑布流。请考虑更新您的浏览器以获得最佳体验。 查看 CanIUse 以获取兼容性信息：[CSS Grid Lanes | Can I use... Support tables for HTML5, CSS3, etc](https://caniuse.com/css-grid-lanes)
> 
> ```plaintext
> [THEME 4 'Topic List Previews'] TypeError: 无法读取未定义的属性（读取 'some'）
> at preview-edits.gjs:101:26
> at K (transformer.js:353:21)
> at get additionalClasses (item.gjs:253:12)
> at R (cache-DtDz7X5V.js:1647:15)
> at index.js:87:32
> at index.js:64:37
> at zn (index.js:396:5)
> at j (index.js:62:16)
> at bi.get (index.js:84:60)
> at Array Iterator.next (<anonymous>)
> at ji.getValue (index.js:244:86)
> at index.js:222:52
> at index.js:64:37
> at zn (index.js:396:5)
> at j (index.js:62:16)
> at my (index.js:1112:57)
> at fy.flush (index.js:1089:26)
> at Object.evaluate (index.js:665:41)
> at Object.evaluate (index.js:103:106)
> at zb.evaluateSyscall (index.js:2873:20)
> at zb.evaluateInner (index.js:2852:64)
> at zb.evaluateOuter (index.js:2849:10)
> at e.next (index.js:4167:45)
> at e._execute (index.js:4157:21)
> at e.execute (index.js:4133:41)
> at _x.handleException (index.js:3450:19)
> at bx.handleException (index.js:3592:52)
> at hx.throw (index.js:3414:16)
> at iy.evaluate (index.js:565:37)
> at hx._execute (index.js:3401:34)
> at hx.execute (index.js:3393:17)
> at xx.rerender (index.js:3610:8)
> at ww.render (index-DaCZcoCY.js:5211:23)
> at index-DaCZcoCY.js:5409:16
> at xb (index.js:2414:7)
> at e.renderRoots (index-DaCZcoCY.js:5389:7)
> at #o (index-DaCZcoCY.js:5374:12)
> at e.revalidate (index-DaCZcoCY.js:5435:10)
> at invoke (index.js:264:14)
> at Rc.flush (index.js:180:11)
> at zc.flush (index.js:334:19)
> at pl._end (index.js:762:32)
> at pl.end (index.js:565:10)
> at pl._run (index.js:806:14)
> at pl._join (index.js:783:19)
> at pl.join (index.js:605:17)
> at Array.Nw (index-DaCZcoCY.js:5301:26)
> at pl._trigger (index.js:860:21)
> at pl._end (index.js:775:16)
> at _boundAutorunEnd (index.js:499:12)
> 
> ```

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2026年七月29日 16:29 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/757 "2026-07-29T16:29:03Z")

</div>

没错，那是已修复的问题之一 🍻

---

<div class="post-metadata">

### Author: ![Ed\_S](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/ed_s/32/134015_2.png) [@Ed\_S](https://meta.discourse.org/u/Ed_S)
#### Post date: [2026年七月29日 16:30 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/758 "2026-07-29T16:30:49Z")

</div>

顺便说一句，我的浏览器并不旧：

> Chrome 已是最新版本 150.0.7871.187（官方内部版本）（arm64）

[上一頁](https://meta.discourse.org/t/topic-list-previews-tlp/209973.md?page=36)

[下一頁](https://meta.discourse.org/t/topic-list-previews-tlp/209973.md?page=38)
