数式をpreviewするUserScript
Scrapboxの数式記法をリアルタイムで表示するUserScript
目的
Scrapboxの数式記法を書き込んでいる間に、どのような数式になるのかreal-timeで確認したい
数式をミスったときに、どこをミスったのか分かるようにしたい
元ネタ
new version
使い方
1. 以下のいずれかから取得したコードを適当なページの適当なコードブロックに貼り付ける
以下、プロジェクト
user のページ scrapbox-katex-previewer の script.js に貼り付けたと仮定する2. 以下を自分のページに貼り付ける
jsimport {mount} from "/api/code/user/scrapbox-katex-previewer/script.js";
mount();3. おしまい
変更点
開発環境をGit+Vim+Deno+TSXに移行した
scrapbox-bundlerでコードを提供するようにした
ユーザーは上記のリンク数式をpreviewするUserScript#6191f14e1280f00000fae7a3 を踏むだけでbundle済みコードを取得できる
TeX表記にプレビュー機能が付いているのと干渉しないようにした
エラー表示を分かりやすくした
old version
iine!!
今までの反省も兼ねて、bundlerも用意したぞい
コピペで安全かつ簡単に導入できる
テーブルがひっついて回るのなんか面白い
develop
パーツを適当に組み合わせて試してみたらできてしまった
denoでminifyしてやる方で試してみたら表示がおかしかった😢
全然調べてないので
のやり方がおかしいだけかもしれませんが一応報告しときます
ほんとだ。表示がおかしいですね
原因が分かったので直します
2021-08-05 08:06:34 直りました！お手数おかけしました。
使ってみたいんだけど、programming-notes内の依存を把握するのがだるい
preactとかのライブラリ使わずに実現できないのかなあ
生のDOMいじるのにうんざりしたので、Preactで組むようにしています
/programming-notes/数式をpreviewするUserScript#60a6e7061280f00000fa3f93のコマンドでbundleすれば楽です
現在のコードを信頼する必要はある
denoのセットアップは必要
出力が大きいので直にScrapboxに貼り付けるよりjsonにしてimportするのがおすすめ
ポータビリティのことではなくて、UserScriptはすべて自己責任なんですべての挙動を自分が把握すべき、と思っているので自分は読むべきだと思ってます
バンドル方法は助かります！
UserScriptはすべて自己責任なんですべての挙動を自分が把握すべき
なので複数ページに分散したmoduleを大量に読み込むようなUserScriptを書くと、申し訳ないな、と思う気持ちになることもあります
すべての依存先scriptをcode readingしないといけない
とはいえ、よく使う関数は毎回コピペするよりmoduleとして一カ所にまとめたほうがメンテナンス性も(開発者本人の)使いやすさも上がるので、たくさんmoduleを読み込んでしまっています……
GitHubにコードを移して、も少し使いやすくする予定です
ちなみに依存の把握だけなら
deno info で見れますpreactとかの部分がどのくらい使われてるかはわかりませんが、jsonのステートからレンダリングするのは毎度リフレッシュしてもこのような用途なら問題ないと思う
まあこれはが作るならの話なので無視してもらってOK