{"id":21401147,"url":"https://github.com/gicentre/prettier-plugin-elm","last_synced_at":"2025-09-09T05:44:09.348Z","repository":{"id":30820029,"uuid":"125265977","full_name":"gicentre/prettier-plugin-elm","owner":"gicentre","description":"Works on top of elm-format, compatible with Prettier v1, v2 and v3","archived":false,"fork":false,"pushed_at":"2024-11-18T22:43:32.000Z","size":3360,"stargazers_count":62,"open_issues_count":2,"forks_count":5,"subscribers_count":8,"default_branch":"main","last_synced_at":"2025-03-24T10:47:01.858Z","etag":null,"topics":["elm","elm-format","gicentre","prettier","prettier-plugin","typescript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"bsd-3-clause","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/gicentre.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-03-14T19:51:26.000Z","updated_at":"2025-03-11T09:27:50.000Z","dependencies_parsed_at":"2024-06-16T11:27:14.800Z","dependency_job_id":"09bbcd53-1a68-453c-a031-32c908b402f9","html_url":"https://github.com/gicentre/prettier-plugin-elm","commit_stats":null,"previous_names":[],"tags_count":13,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gicentre%2Fprettier-plugin-elm","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gicentre%2Fprettier-plugin-elm/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gicentre%2Fprettier-plugin-elm/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gicentre%2Fprettier-plugin-elm/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/gicentre","download_url":"https://codeload.github.com/gicentre/prettier-plugin-elm/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247773721,"owners_count":20993639,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["elm","elm-format","gicentre","prettier","prettier-plugin","typescript"],"created_at":"2024-11-22T15:26:20.399Z","updated_at":"2025-04-08T04:17:38.436Z","avatar_url":"https://github.com/gicentre.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u0026nbsp;\u0026nbsp;\u003cimg alt=\"Prettier\"\n  src=\"https://cdn.rawgit.com/prettier/prettier-logo/master/images/prettier-icon-light.svg\"\u003e\u0026nbsp;\u0026nbsp;\n  \u0026nbsp;\u0026nbsp;\u003cimg alt=\"Elm\"\n  height=\"210\"\n  src=\"https://upload.wikimedia.org/wikipedia/commons/thumb/f/f3/Elm_logo.svg/1024px-Elm_logo.svg.png\"\u003e\u0026nbsp;\u0026nbsp;\n\u003c/p\u003e\n\n\u003ch2 align=\"center\"\u003ePrettier Elm plugin\u003c/h2\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://github.com/gicentre/prettier-plugin-elm/blob/main/LICENSE\"\u003e\n    \u003cimg alt=\"license: BSD-3-Clause\" src=\"https://img.shields.io/github/license/gicentre/prettier-plugin-elm.svg?style=flat-square\"\u003e\u003c!--\n  --\u003e\u003c/a\u003e\n  \u003ca href=\"https://www.npmjs.com/package/prettier-plugin-elm\"\u003e\n    \u003cimg alt=\"NPM package\" src=\"https://img.shields.io/npm/v/prettier-plugin-elm.svg?style=flat-square\"\u003e\u003c!--\n  --\u003e\u003c/a\u003e\n  \u003ca href=\"https://github.com/gicentre/prettier-plugin-elm/actions/workflows/ci.yml\"\u003e\n    \u003cimg alt=\"GitHub Workflow Status (CI)\" src=\"https://img.shields.io/github/actions/workflow/status/gicentre/prettier-plugin-elm/ci.yml?label=CI\u0026style=flat-square\"\u003e\u003c!--\n  --\u003e\u003c/a\u003e\n  \u003ca href=\"https://codecov.io/gh/gicentre/prettier-plugin-elm\"\u003e\n    \u003cimg alt=\"Codecov\" src=\"https://img.shields.io/codecov/c/github/gicentre/prettier-plugin-elm?style=flat-square\u0026token=38aa3a14f00b4d3cbb8e39a9d69e6c64\"\u003e\u003c!--\n  --\u003e\u003c/a\u003e\n  \u003cbr\u003e\n  \u003ca href=\"https://www.npmjs.com/package/prettier-plugin-elm\"\u003e\n    \u003cimg alt=\"downloads\" src=\"https://img.shields.io/npm/dt/prettier-plugin-elm.svg?style=flat-square\"\u003e\u003c!--\n   --\u003e\u003c/a\u003e\n  \u003ca href=\"#badge\"\u003e\n    \u003cimg alt=\"code style: Prettier\" src=\"https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square\"\u003e\u003c!--\n  --\u003e\u003c/a\u003e\n  \u003ca href=\"https://twitter.com/giCentre\"\u003e\n    \u003cimg alt=\"giCentre on Twitter\" src=\"https://img.shields.io/badge/follow-%40giCentre-1DA1F2?logo=twitter\u0026style=flat-square\"\u003e\u003c!--\n  --\u003e\u003c/a\u003e\n\u003c/p\u003e\n\nThis plugin integrates [`elm-format`](https://github.com/avh4/elm-format) into [Prettier](https://github.com/prettier/prettier).\nIn addition to dealing with `.elm` files via Prettier API, this plugin lets you format Elm code blocks inside markdown documents.\n\nFor example,\n\n\u003c!-- prettier-ignore --\u003e\n````markdown\n#    Hello world in Elm\n```elm\nimport  Html exposing     (text)\n\nmain = text      \"Hello, World!\"\n```\n````\n\nbecomes:\n\n````markdown\n# Hello world in Elm\n\n```elm\nimport Html exposing (text)\n\n\nmain =\n    text \"Hello, World!\"\n```\n````\n\nYou can disable code formatting for a particular code block by adding \u003cnobr\u003e`\u003c!-- prettier-ignore --\u003e`\u003c/nobr\u003e before ` ```elm `.\n\n````markdown\nElm code with custom formatting:\n\n\u003c!-- prettier-ignore --\u003e\n```elm\nmain = text      \"Hello, World!\"\n```\n\nPrettified code:\n\n```elm\nmain =\n    text \"Hello, World!\"\n```\n````\n\nThe latest version of `prettier-plugin-elm` assumes that you are using Elm 0.19.\nFor compatibility with Elm 0.18, please install `prettier-plugin-elm@0.3`.\n\n## Getting started\n\nThe instructions assume that you have already installed Node.js on your machine.\nTo check its presence, open the terminal and type these two commands:\n\n```sh\nnode --version\n## ≥ 12.15\n\nnpm --version\n## ≥ 6.14\n```\n\nIf you see errors or if the displayed versions are too old, follow the instructions on [nodejs.org](https://nodejs.org) to download this software.\nBy installing Node.js you also get NPM, so there is no need to obtain it separately.\nYou might need to restart the terminal or the whole machine to see the new versions.\n\n### Global install\n\nThe easiest way to get started with Prettier and its Elm plugin is to globally install two NPM packages:\n\n```sh\nnpm install --global prettier@2 prettier-plugin-elm\n```\n\nGlobal install is preferred in simple scenarios, especially when you are working alone on small projects.\n\n_Prettier v3 does has [dropped support for automatic plugin search](https://github.com/prettier/prettier/pull/14759) so we need to install `prettier@2` globally. If you want to use Prettier v3, you need to install it locally and [mention](https://prettier.io/docs/en/plugins.html) `prettier-plugin-elm` in the config file._\n\n### Local install\n\nWhen collaborating on a group project, it is useful to keep versions of Prettier and its Elm plugin in sync within the team.\nThis avoids frequent unwanted changes in source files, which can be caused by formatting differences between tool versions.\n\n1.  Open a terminal and ensure you are located at the root of your project:\n\n    ```sh\n    pwd\n    ## prints something like /path/to/my/project\n    ```\n\n1.  If there is no `package.json` file in your project directory, initialize it:\n\n    ```sh\n    npm init --yes\n    ```\n\n    ```sh\n    ## if you use yarn instead of npm\n    yarn init --yes\n    ```\n\n1.  Run the install command:\n\n    ```sh\n    npm install --only=dev prettier prettier-plugin-elm\n    ```\n\n    ```sh\n    ## if you use yarn instead of npm\n    yarn add --dev prettier prettier-plugin-elm\n    ```\n\n    Versions of Prettier and its Elm plugin will be written to `package.json` and `package-lock.json` / `yarn.lock`.\n    If you share these files with the rest of your source code, others will be able to get the exact same versions of the tools by running:\n\n    ```sh\n    npm install\n    ```\n\n    ```sh\n    ## if you use yarn instead of npm\n    yarn install\n    ```\n\n1.  Mention the plugin in the config file:\n\n    1.  Create a file named `.prettierrc.json` in the root of your project.\n        If you already have this file, open it instead. Note that it can be called differently because Prettier supports [several config file names](https://prettier.io/docs/en/configuration.html).\n\n    1.  Add the following content to the file:\n\n        ```json\n        {\n          \"plugins\": [\"prettier-plugin-elm\"]\n        }\n        ```\n\n        This tells Prettier to use the Elm plugin when formatting files.\n\n    1.  Save the file.\n\nNote that you need to repeat the local install steps for every project.\n\n---\n\nℹ️ Combining global and local setup is allowed.\nIf two copies of Prettier are available for a given folder, a local one is used.\n\n---\n\nℹ️ To upgrade Prettier and its Elm plugin, run the same command as you used to install them.\n\n---\n\nℹ️ Installing `prettier-plugin-elm` also downloads a compatible version of `elm-format`, so you do not need to manually obtain it yourself.\n\n## Usage\n\nPlease complete the the _Getting started_ section first.\n\n### Via editor\n\nFollow the [instructions on prettier.io](https://prettier.io/docs/en/editors.html) to download Prettier extension for your editor.\nAs the second step, you might need to open editor preferences and select Prettier as your preferred file formatter.\nMost editors can format files on save and you are encouraged to enable this option.\n\n---\n\nℹ️ You might need to restart the editor if formatting does not work for Elm or Markdown files right away.\n\n### Via terminal\n\nIf you have a locally installed copy of Prettier, you can configure a script to [lint](https://en.wikipedia.org/wiki/Linting) (i.e. check) all your project files and even automatically fix their formatting.\n\nFor inspiration, see the `scripts` section in this project’s [`package.json`](https://github.com/gicentre/prettier-plugin-elm/blob/main/tsconfig.json).\nYou will also need to create a file named `.prettierignore`, similar to the [one in this project](https://github.com/gicentre/prettier-plugin-elm/blob/main/.prettierignore).\n\n```sh\n## Lint (i.e. check) if all source files are formatted\nnpm run lint:prettier\n\n## Fix formatting in all files\nnpm run fix:prettier\n```\n\n```sh\n## if you use yarn instead of npm\n\n## Lint (i.e. check) if all source files are formatted\nyarn lint:prettier\n\n## Fix formatting in all files\nyarn fix:prettier\n```\n\n## Implementation details\n\nThis plugin is written in TypeScript.\nThe quality of the codebase is checked using Prettier, [Jest](https://jestjs.io) and [ESLint](https://eslint.org) via [Github Actions](https://github.com/gicentre/prettier-plugin-elm/actions).\nTests run on Linux, macOS and Windows.\n\nUnlike most other [Prettier plugins](https://prettier.io/docs/en/plugins.html#official-plugins), `prettier-plugin-elm` does not contain logic to parse code blocks into syntax trees to then stringify them.\nBoth of these tasks are delegated to [`elm-format`](https://github.com/avh4/elm-format) by making a call to a sub-process.\nThus, the result of formatting is compatible with what Elm community is used to see.\n\nThe only difference to `elm-format` introduced by `prettier-plugin-elm` is related to handling fragments of Elm modules, which is [not supported](https://github.com/avh4/elm-format/issues/65) upstream yet.\nSee [`src/parser.ts`](https://github.com/gicentre/prettier-plugin-elm/blob/main/src/parser.ts) for details on the workaround.\n\n## Contributing\n\nIf you’re interested in contributing to the development of Prettier Elm plugin, please follow the [CONTRIBUTING guide from Prettier](https://github.com/prettier/prettier/blob/main/CONTRIBUTING.md) as it all applies to this repository too.\n\nTo run the development version of `prettier-plugin-elm`:\n\n- Clone this repository\n- Run `yarn install`\n- Run `yarn lint` to make sure that the codebase passes linting\n- Run `yarn test` to make sure that TypeScript successfully compiles into JavaScript and and all unit tests pass\n- To test the plugin manually, create a file named `prettier-test.elm` (or `.md`).\n  Then run `yarn prettier --plugin=. prettier-test.elm` (or `.md`) and check the output.\n\n## Credits\n\nThis project was inspired by \u003chttps://github.com/prettier/plugin-python\u003e.\nBig thanks to Aaron VonderHaar ([@avh4](https://github.com/avh4)) and [contributors](https://github.com/avh4/elm-format/graphs/contributors) for creating [`elm-format`](https://github.com/avh4/elm-format)!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgicentre%2Fprettier-plugin-elm","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgicentre%2Fprettier-plugin-elm","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgicentre%2Fprettier-plugin-elm/lists"}