Skip to content

GoodbyeNJN/obsidian-plugin-prettier

Repository files navigation

obsidian-plugin-prettier

GitHub Release GitHub Downloads

This is an Obsidian plugin that uses Prettier to format notes.

The main inspiration comes from https://github.com/hipstersmoothie/obsidian-plugin-prettier. Since that repository is not actively maintained and does not declare an open source license, I have re-implemented its features and added some new features.

Features

  • Multi language support, currently available in Simplified Chinese and English.

  • Supports Markdown and MDX formats.

  • Format the entire content or only the selected content.

  • Automatically format the content when saving the file.

  • Format embedded code blocks. Currently supports js(x), ts(x), css, scss, less, html, json, and yaml.

  • Optionally remove extra spaces in formatted list items. See related discussions issues#4114 and issues#4281.

    Example:

    -␣␣␣item 1
    -␣␣␣item 2

    Formatted:

    -␣item 1
    -␣item 2
  • Optionally add trailing spaces that are removed after formatting. This ensures correct rendering in live preview mode.

    Example:

    -
    -␣[ ]

    Formatted:

    -␣
    -␣[ ]
  • Configurable Prettier formatting options. See Prettier documentation for details.

    Example:

    {
        "trailingComma": "es5",
        "tabWidth": 4,
        "semi": false,
        "singleQuote": true
    }
  • Supports enabling or disabling formatting for the current file separately in frontmatter. Enabled by default when not set.

    Example:

    ---
    prettier: false
    ---

Commands and Menus

  • Format all content

    ID: format-content

    Hotkey: None (default)

  • Format selected content

    ID: format-selection

    Hotkey: None (default)

    Only available when some content is selected.

Settings

  • Format on save

    Default: false

    Format the current content when saving the file.

  • Format code blocks

    Default: false

    Include code blocks when formatting. Currently supports js(x), ts(x), css, scss, less, html, json, and yaml.

  • Remove extra spaces

    Default: false

    Remove extra spaces after bullet points in unordered lists.

  • Add trailing spaces

    Default: false

    Add spaces at the end of empty list items to ensure correct rendering in live preview mode.

  • Format options

    Default:

    {
        "trailingComma": "es5",
        "tabWidth": 4,
        "semi": false,
        "singleQuote": true
    }

    Formatting options passed to Prettier (in JSON format).

Development

  1. Install dependencies:

    pnpm install
  2. Build the plugin:

    pnpm build

    The built files will be located in the dist directory.

  3. Load the plugin in Obsidian.

  4. You can also use the following command to watch for file changes and automatically build:

    pnpm dev

    If the OBSIDIAN_PLUGINS_DIR environment variable is set, the built files will also be automatically copied to the $OBSIDIAN_PLUGINS_DIR/prettier-dev directory.

    OBSIDIAN_PLUGINS_DIR=/path/to/the/plugins/directory pnpm dev

    Alternatively, copy .env.example to .env and modify the OBSIDIAN_PLUGINS_DIR value.

License

MIT