md
v1.6.0
Los documentos de Markdown se representan automáticamente como imágenes y textos de WeChat en tiempo real, ¡para que ya no se preocupe por el diseño del artículo de WeChat! Mientras sepa la gramática básica de Markdown, puede crear una imagen y texto de WeChat con estilos concisos y una hermosa apariencia.
Nota: Se recomienda usar el navegador Chrome, los mejores resultados.
El editor existente de WeChat Markdown de código abierto tiene estilos complejos y no satisface mis necesidades estéticas personales. Cuando los uso para escribir artículos, a menudo tengo que hacer algunos cambios yo mismo, lo cual requiere mucho tiempo y que hace mucho trabajo, así que comencé a hacer un desarrollo secundario.
¡Los amigos pueden enviar PR en cualquier momento para mejorar este editor de WeChat Markdown! Si tiene nuevas ideas, también puede ser bienvenido a los comentarios en el área de discusión de discusiones.
Nota: La última versión de nuestro proyecto se desarrolla basada en VUE3. La versión anterior basada en Vue2 ya no se mantiene. Si necesita la versión VUE2, cambie a la rama 1.x.
| # | Cama con imagen | ¿Es necesario configurarlo al usarlo? | Observación |
|---|---|---|---|
| 1 | por defecto | No | - |
| 2 | Github | Configurar los parámetros Repo y Token | ¿Cómo conseguir el token de Github? |
| 3 | Nube de alibaba | Configurar los parámetros AccessKey ID , AccessKey Secret , Bucket , Region | ¿Cómo usar Alibaba Cloud OSS? |
| 4 | Nube de tencent | Configurar los parámetros SecretId , SecretKey , Bucket , Region | ¿Cómo usar Tencent Cloud Cos? |
| 5 | Nube de qiniu | Configurar los parámetros AccessKey , SecretKey , Bucket , Domain , Region | ¿Cómo usar Qiniu Cloud Kodo? |
| 6 | Minio | Configurar los parámetros de Endpoint , Port , UseSSL , Bucket , AccessKey y SecretKey | ¿Cómo usar minio? |
| 7 | Cuenta oficial | Configurar los parámetros代理域名appID , appsecret , PROXY | ¿Cómo obtener la contraseña oficial de ID de desarrollador de la cuenta? |
| 8 | Cloudflare R2 | Configurar los parámetros de AccountId , AccessKey , SecretKey , Bucket , Domain | Cómo operar R2 usando S3 API |
| 9 | Subida personalizada | Sí | ¿Cómo personalizar las cargas? |
En el caso de que no se proporcionen camas de gráficos predefinidos en la herramienta, solo necesita personalizar la lógica de carga, lo cual es muy útil, por ejemplo, cuando no es conveniente usar las camas de gráficos públicos, sino usar su propio servicio de carga.
Solo necesita cambiar el código de carga en la función dada. Por conveniencia, esta función proporciona algunos parámetros que se pueden usar:
Código de muestra:
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, // 上传失败调用的函数
// }Si ha creado un código de carga para otras camas de imágenes de terceros, puede compartirlo.
# 安装依赖
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/ A través de nuestra CLI NPM, puede construir fácilmente su propio editor de WeChat Markdown.
# 安装
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 admite los siguientes parámetros de línea de comando:
port especifica el número de puerto, el valor predeterminado es 8800, y si está ocupado, se usará un nuevo puerto al azar.spaceId DCLOUDclientSecretSi es un usuario de Docker, también puede usar un comando para iniciar una instancia totalmente privada que le pertenece.
docker run -d -p 8080:80 doocs/md:latestDespués de que el contenedor se ejecute, abra el navegador y visite http: // localhost: 8080.
Para obtener información más detallada sobre las imágenes de Docker en este proyecto, puede seguir https://github.com/doocs/docker-md
Nota: Si usa este editor de Markdown para el diseño del artículo y desea mostrar su cuenta oficial en este proyecto ReadMe, deje un mensaje en el #5.
