Markdown -Dokumente werden automatisch als WeChat -Bilder und -Texte in Echtzeit gerendert, sodass Sie sich nicht mehr um WeChat -Artikellayout kümmern! Solange Sie die grundlegende Markdown -Grammatik kennen, können Sie ein WeChat -Bild und einen Text mit prägnanten Stilen und einem schönen Aussehen erstellen.
Hinweis: Es wird empfohlen, Chrome Browser, die besten Ergebnisse, zu verwenden.
Der vorhandene Open Source Wechat -Markdown -Editor verfügt über komplexe Stile und entspricht nicht meinen persönlichen ästhetischen Bedürfnissen. Wenn ich sie benutze, um Artikel einzugeben, muss ich oft selbst einige Änderungen vornehmen, was zeitaufwändig und arbeitsintensiv ist, also begann ich, eine sekundäre Entwicklung zu führen.
Freunde können jederzeit PR einreichen, um diesen WeChat -Markdown -Editor besser zu machen! Wenn Sie neue Ideen haben, können Sie auch im Diskussionsbereich der Diskussion Feedback eingeladen.
Hinweis: Die neueste Version unseres Projekts basiert auf VUE3. Die alte Version, die auf VUE2 basiert, wird nicht mehr aufrechterhalten. Wenn Sie die VUE2 -Version benötigen, wechseln Sie bitte zum 1.x -Zweig.
| # | Bildbett | Ist es notwendig zu konfigurieren, wenn Sie es verwenden? | Bemerkung |
|---|---|---|---|
| 1 | Standard | NEIN | - - |
| 2 | Github | Konfigurieren Sie Repo und Token -Parameter | Wie bekomme ich Github -Token? |
| 3 | Alibaba Cloud | Konfigurieren Sie AccessKey ID , AccessKey Secret , Bucket , Region Parameter | Wie benutze ich Alibaba Cloud OSS? |
| 4 | Tencent Cloud | Konfigurieren Sie SecretId , SecretKey , Bucket , Region | Wie benutze ich Tencent Cloud COS? |
| 5 | Qiniu Cloud | Konfigurieren Sie AccessKey , SecretKey , Bucket , Domain , Region Parameter | Wie benutze ich Qiniu Cloud Kodo? |
| 6 | Minio | Konfigurieren Sie Endpoint , Port , UseSSL , Bucket , AccessKey , SecretKey -Parameter | Wie benutze ich Minio? |
| 7 | Offizielles Konto | Konfigurieren Sie appID , appsecret ,代理域名-Parameter | Wie bekomme ich das offizielle Konto für Kontoentwickler -IDs? |
| 8 | Cloudflare R2 | Konfigurieren Sie AccountId , AccessKey , SecretKey , Bucket , Domain | So bedienen Sie R2 mit S3 API |
| 9 | Benutzerdefinierte Upload | Ja | Wie kann ich Uploads anpassen? |
In dem Fall, in dem vordefinierte Graphenbetten nicht im Tool bereitgestellt werden, müssen Sie nur die Upload -Logik anpassen. Dies ist beispielsweise sehr nützlich, wenn Sie nicht bequem für die Verwendung der öffentlichen Grafikbetten verwendet werden, sondern stattdessen Ihren eigenen Upload -Service verwenden.
Sie müssen den Upload -Code in der angegebenen Funktion nur ändern. Für den Einfachheit halber bietet diese Funktion einige Parameter, die verwendet werden können:
Beispielcode:
const { file , util , okCb , errCb } = CUSTOM_ARG
const param = new FormData ( )
param . append ( `file` , file )
util . axios
. post ( `http://127.0.0.1:9000/upload` , param , {
headers : { 'Content-Type' : `multipart/form-data` } ,
} )
. then ( ( res ) => {
okCb ( res . url )
} )
. catch ( ( err ) => {
errCb ( err )
} )
// 提供的可用参数:
// CUSTOM_ARG = {
// content, // 待上传图片的 base64
// file, // 待上传图片的 file 对象
// util: {
// axios, // axios 实例
// CryptoJS, // 加密库
// OSS, // tiny-oss
// COS, // cos-js-sdk-v5
// Buffer, // buffer-from
// uuidv4, // uuid
// qiniu, // qiniu-js
// tokenTools, // 一些编码转换函数
// getDir, // 获取 年/月/日 形式的目录
// getDateFilename, // 根据文件名获取它以 时间戳+uuid 的形式
// },
// okCb: resolve, // 重要!上传成功后给此回调传 url 即可
// errCb: reject, // 上传失败调用的函数
// }Wenn Sie einen Upload-Code für andere Bildbetten von Drittanbietern erstellt haben, können Sie ihn sehr gerne teilen.
# 安装依赖
npm i
# 启动开发模式
npm start
# 部署在 /md 目录
npm run build
# 访问 http://127.0.0.1:9000/md
# 部署在根目录
npm run build:h5-netlify
# 访问 http://127.0.0.1:9000/ Über unsere NPM CLI können Sie problemlos Ihren eigenen WeChat -Markdown -Editor erstellen.
# 安装
npm i -g @doocs/md-cli
# 启动
md-cli
# 访问
open http://127.0.0.1:8800/md/
# 启动并指定端口
md-cli port=8899
# 访问
open http://127.0.0.1:8899/md/MD-CLI unterstützt die folgenden Befehlszeilenparameter:
port gibt die Portnummer an, die Standardeinstellung beträgt 8800, und wenn er besetzt ist, wird ein neuer Port zufällig verwendet.spaceId DCloud Service Space ConfigurationclientSecret dcloud Service Space ConfigurationWenn Sie ein Docker -Benutzer sind, können Sie auch einen Befehl verwenden, um eine vollständig private Instanz zu starten, die Ihnen gehört.
docker run -d -p 8080:80 doocs/md:latestÖffnen Sie nach dem Laufen des Containers den Browser und besuchen Sie http: // localhost: 8080.
Ausführlichere Informationen zu Docker-Bildern in diesem Projekt finden Sie unter https://github.com/doocs/docker-md
Hinweis: Wenn Sie diesen Markdown -Editor für das Artikellayout verwenden und Ihr offizielles Konto in diesem Projekt Readme anzeigen möchten, hinterlassen Sie bitte eine Nachricht in #5.