English | 简体中文

MDX Editor

A versatile WeChat typesetting editor, also serving as a cross-platform Markdown note-taking software.

Inspiration

Markdown, beloved by countless programmers as a writing format, falls short in meeting the typesetting demands of WeChat. Fortunately, MDX comes to the rescue, mending Markdown's inadequacies. As my own blog utilizes MDX for writing, I pondered upon the possibility of achieving a unified solution for writing and typesetting when I stumbled upon the mdxjs playground.

Features

Web Version

• Seamlessly copy to WeChat Official Accounts with just a click
• Customize styled components and styles, generate QR codes and code diff highlights
• Generate article indexes effortlessly
• Create WeChat footnotes with ease
• Automatically convert WeChat external links into span elements
• Ensure code formatting precision
• Facilitate article sharing with built-in functionality
• Download markdown files effortlessly
• Export to PDF seamlessly

Desktop Version

In addition to the web version's features, the desktop version includes:

• Real-time local file saving
• Efficient management of local file directories
• Hassle-free HTML export functionality

Template Examples

Subtle Green Card	Early Summer Style
Resume Template	Exquisite Code Diff Highlights
Generate Captivating QR Codes	Travel Itinerary

Development

To access the web version, switch to the main branch and follow these commands:

yarn
yarn dev

For the desktop version, switch to the tauri-app branch and execute the following commands:

yarn
yarn tauri dev

FAQ

1. After installing on macOS, it shows "The file is damaged" or there is no response when opening it

Because MDX Editor is not signed, it is blocked by macOS security checks.

If you encounter the "The file is damaged" error after installation, follow these steps:

Trust the developer, and it will prompt you to enter your password:

sudo spctl --master-disable

Then allow MDX Editor:

xattr -cr /Applications/MDX\ Editor.app

After that, you should be able to open it normally.

If you see the following message:

option -r not recognized

usage: xattr [-slz] file [file ...]
       xattr -p [-slz] attr_name file [file ...]
       xattr -w [-sz] attr_name attr_value file [file ...]
       xattr -d [-s] attr_name file [file ...]
       xattr -c [-s] file [file ...]

The first form lists the names of all xattrs on the given file(s).
The second form (-p) prints the value of the xattr attr_name.
The third form (-w) sets the value of the xattr attr_name to attr_value.
The fourth form (-d) deletes the xattr attr_name.
The fifth form (-c) deletes (clears) all xattrs.

options:
  -h: print this help
  -s: act on symbolic links themselves rather than their targets
  -l: print long format (attr_name: attr_value)
  -z: compress or decompress (if compressed) attribute value in zip format

Execute the command:

xattr -c /Applications/MDX\ Editor.app/*

If the above command still doesn't work, you can try the following command:

sudo xattr -d com.apple.quarantine /Applications/MDX\ Editor.app/

Deployment

Deployed using the Vercel Platform from the creators of Next.js.

References

• mdxjs playground
• play.tailwindcss.com