wxmp
v2.4.0
Wechatの公式アカウント記事Markdown Online Editor、Markdown Grammarを使用して、美しく寛大なWechatの公式アカウントの写真とテキストの紹介を作成します。公開バージョンの手間がかかり、いくつかの機能を拡大できないため、開発は停滞しています。将来的には、Chromeプラグインは開発されなくなり（Chrome Branchが一時的に存在します）、よりリッチな関数はWebバージョンを通じてカスタマイズされます。
開発計画といくつかの機能は、必要に応じて問題に導入でき、ツールをより完璧にします。次の例は、Webアプリケーションでの効果表示に使用されます。
以下は、 jsxコードブロック表示の例であり、Webアプリケーションで効果ディスプレイのコードを強調表示します。
function Demo ( ) {
return < div className = "demo" > Hello World! </ div >
}以下はcssコードブロック表示の例です。Webアプリケーションでのエフェクト表示のコードを強調表示します。
li {
font-size : 16 px ;
margin : 0 ;
line-height : 26 px ;
color : rgb ( 30 41 59 );
font-family : -apple-system-font , BlinkMacSystemFont , Helvetica Neue , PingFang SC , Hiragino Sans GB , Microsoft YaHei UI , Microsoft YaHei , Arial , sans-serif;
}Webアプリケーションに効果を表示するために使用されます。
インラインコード{code: 0}
テーブルはカスタムスタイルを使用できず、まだ解決策は見つかりません
| ヘッダー1 | ヘッダー2 |
|---|---|
| キー1 | 値1 |
| キー2 | 値2 |
| キー3 | 値3 |
これは、単純なマークダウン1構文脚注2です。ページの最後にいくつかの追加のテキストの説明があります。これは完全な脚注3機能ではないことに注意してください。
< ruby >
汉 < rt > Han </ rt >
</ ruby >漢字の発音効果：中国語キャラクタースペル音注記音
HTMLコメントは、MarkdownのMarkdownでも使用できます。この機能は、一部のコンテンツのスタイルをカスタマイズするために使用されます。 HTMLコメント<!--rehype:xxx-->を使用して、マークダウンを有効にしてスタイルのカスタマイズをサポートします。
## 定义标题样式
<!-- rehype:style=display: flex; height: 230px; align-items: center; justify-content: center; font-size: 38px; -->
支持对某些文字变更样式，如_文字颜色_ <!-- rehype:style=color: red; --> ，文字颜色将被设置为红色(red)。<!--rehype:style= to start、 -->を終了し、CSSスタイルを真ん中にラップして使用しますcolor: red;テキストを赤く設定します。
この機能では、HTMLコメントを使用してMarkdownで無視されます。無視する必要があるコンテンツをマークします。マークは<!--rehype:ignore:start--> 、mark end <!--rehype:ignore:end--> 、そしてwechat markdownエディターのプレビューには表示されません。 GitHubなどの他のプレビューツールにコンテンツを表示します。
# 注释忽略
<!-- rehype:ignore:start -->内容在微信 Markdown 编辑器预览中不显示。在其它预览工具中展示内容。 <!-- rehype:ignore:end --> https://<URL>?md=<Markdown 资源 URL>
マークダウンコンテンツをロードするためのサンプルURL：
https://jaywcjlove.github.io/wxmp/#/?theme=underscore&md=https://raw.githubusercontent.com/jaywcjlove/c-tutorial/master/README.md
Markdown URL 地址: https://raw.githubusercontent.com/jaywcjlove/c-tutorial/master/README.md
デフォルトのテーマをディレクトリwebsite/src/themesに保存し、 website/src/store/context.tsxでテーマを構成し、 cssを使用してスタイルを定義し、複雑なセレクターをサポートしません。オンラインテーマエディターが提供されています。すべての人が使用できるように、倉庫に変更してPRを変更します。
/* 1~6 标题样式定义 */
h1 {} h2 {} h3 {} h4 {} h5 {} h6 {}
a { color : red; } /* 超链接样式定义 */
strong {} /* 加粗样式定义 */
del {} /* 删除线样式定义 */
em {} /* 下划线样式定义 */
u {} /* 下划线样式定义 */
p {} /* 段落样式定义 */
ul {} /* 无序列表样式定义 */
ol {} /* 有序列表样式定义 */
li {} /* 列表条目样式定义 */
blockquote {} /* 块级引用样式定义 */
table {}
td {}
th {}
pre {} /* 样式定义 */
. code-highlight {} /* 代码块样式定义 */
. code-line {} /* 代码块行样式定义 */
. code-spans {} /* 代码块行样式定义 */
sup {} /* GFM 脚注样式定义 */
. footnotes-title {} /* GFM 脚注，参考标题样式定义 */
. footnotes-list {} /* GFM 脚注，参考列表样式定义 */
. image-warpper {} /* 图片父节点样式定义 */
. image {} /* 图片样式定义 */
/* 部分代码高亮样式 */
. comment {}
. property {}
. function {}
. keyword {}
. punctuation {}
. unit {}
. tag {}
. color {}
. selector {}
. quote {}
. number {}
. attr-name {}
. attr-value {}Dockerを通じて「WeChat公式アカウントMarkdown Editor」Webサイトアプリケーションを簡単に展開できます。
docker pull wcjiang/wxmp
# Or
docker pull ghcr.io/jaywcjlove/wxmp:latestdocker run --name wxmp --rm -d -p 8113:3000 wcjiang/wxmp:latest
# Or
docker run --name wxmp -itd -p 8113:3000 wcjiang/wxmp:latest
# Or
docker run --name wxmp -itd -p 8113:3000 ghcr.io/jaywcjlove/wxmp:latestブラウザで次のURLにアクセスします
http://localhost:96611/
いつものように、私たちの素晴らしい貢献者に感謝します！
上記の画像の貢献者リスト、貢献者の画像は、アクションコントリビュータ師によって自動的に生成されます4 。
MITライセンスに基づいてライセンスされています。
Github-Style Markdown仕様https://github.github.com/gfm/
脚注https://github.blog/changelog/2021-09-30-footnotes-now-supported-in-markdown-fields/
WeChatの記事は、アンカージャンプやサードパーティのURLハイパーリンクを開くことをサポートしていないため、完全な脚注機能をサポートしていません。 ↩
アクション貢献者https://github.com/jaywcjlove/github-aftion-contributors↩
