https://github.com/orlov-vo/prettier-plugin-svelte

It's a more valid formatter for Svelte 3.0
https://github.com/orlov-vo/prettier-plugin-svelte

Last synced: 3 months ago
JSON representation

It's a more valid formatter for Svelte 3.0

• Host: GitHub
• URL: https://github.com/orlov-vo/prettier-plugin-svelte
• Owner: orlov-vo
• Fork: true (sveltejs/prettier-plugin-svelte)
• Created: 2019-04-24T15:28:39.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2019-06-17T18:45:27.000Z (over 5 years ago)
• Last Synced: 2024-09-19T07:42:45.023Z (3 months ago)
• Language: TypeScript
• Homepage: https://www.npmjs.com/package/@orlov_vo/prettier-plugin-svelte
• Size: 295 KB
• Stars: 1
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Prettier for Svelte 3 components

Format your svelte components using prettier.

## Features

-   Format your html, css, and javascript using prettier

-   Format Svelte syntax, e.g. each loops, if statements, await blocks, etc.

-   Format the javascript expressions embedded in the svelte syntax

    -   e.g. expressions inside of `{}`, event bindings `on:click=""`, and more

## Different from [original](https://github.com/UnwrittenFun/prettier-plugin-svelte)

This fork:

-   Doesn't collapse non-closable tags like `
`

-   Generate valid attributes (example: `
`)

-   ~~Have "true" order in components: scripts, template, styles.~~ Now we have `sort-order` option with `scripts-html-css` as default value


## How to use

Install `@orlov_vo/prettier-plugin-svelte` as a dev dependency in your project.

```

npm install --save-dev @orlov_vo/prettier-plugin-svelte

```

Then format your code using prettier cli. You may need to add `--plugin-search-dir=.`

```

prettier --write --plugin-search-dir=. ./**/*.html

```

## Options

**`sort-order`** Sort order for scripts, html, and css. Defaults to `scripts-html-css`.

```

prettier --write --sort-order html-scripts-css ./**/*.svelte

```