目次のプレビュー#456
Conversation
| "boxen": "^6.2.1", | ||
| "cheerio": "1.0.0-rc.12", | ||
| "chokidar": "^3.5.3", | ||
| "clsx": "^2.0.0", |
There was a problem hiding this comment.
classの連結のために導入しています。
| /** | ||
| * Markdownプレビュー内のコードブロックにコピーボタンを追加するコンポーネント | ||
| */ | ||
| export const InsertAnchorButtonToHeadings: React.FC<Props> = ({ children }) => { |
There was a problem hiding this comment.
記事本文のhtmlをDOM操作で加工するアプローチを採っています
| }); | ||
|
|
||
| return () => { | ||
| // クリーンアップ処理でボタンを削除と、見出しの追加クラスを削除する |
There was a problem hiding this comment.
クリーンアップ処理でホットリロードの度に要素が無限に増え続けるのを抑止しています
cm-igarashi-ryosuke
left a comment
cm-igarashi-ryosuke
left a comment
There was a problem hiding this comment.
すばらしい！！！
LGTMです！！！
1点コメントしましたがこのPRとは別で検討で大丈夫です。
cm-wada-yusuke
left a comment
cm-wada-yusuke
left a comment
There was a problem hiding this comment.
ありがとうございます、いい感じです。いくつか確認をお願いします！
| ); | ||
| }, 3000); | ||
| }); | ||
| }); |
There was a problem hiding this comment.
[imo] Zenn本体のHTMLは、同じ見た目（見出しの隣にアンカーボタン 🔗 を表示）ですが、クリックすると そこにジャンプする という挙動になります。
Zenn本体のHTMLは読者が、CLIのプレビューは執筆者が見るため別々でも良い…という意見もあるかもしれませんが、個人的にはまったく同じ見た目では同じ挙動を期待します。
ということでこちらCLIのほうはアイコンをコピーアイコンのようなものにすると良いかな？と思ったのですがどうでしょうか。
There was a problem hiding this comment.
個人的にはアンカーアイコンでそこまで違和感なかったのですが、
まったく同じ見た目では同じ挙動を期待します。
は仰る通りかと思ったので、コピーアイコンにしてみました！
Descriptionにgifを貼っております！
| @@ -0,0 +1,47 @@ | |||
| import * as cheerio from 'cheerio'; | |||
There was a problem hiding this comment.
[nits] TOCを生成するロジックは現在別のサーバーにあるのですが、こちらに持ってくる場合はサーバー側の処理が不要になります。チーム内で相談させてください。
3 participants
📑 Summary
#331 をベースに目次のプレビュー機能を実装。
Resolves zenn-dev/zenn-community#399 zenn-dev/zenn-community#529
📋 Tasks
プルリクエストを作成いただく際、お手数ですが以下の内容についてご確認をお願いします。
canaryブランチに対するプルリクエストであるより詳しい内容は Pull Request Policy を参照してください。