Adopt Prettier for this repo

[edosenseidotcom]

A cool feature of svelte-ionic-app is that it can install Prettier for you.

However, the project files aren't currently linted with Prettier; after creating a new project, Prettier changes 7 files.

Steps to reproduce

1. npm create ionic-svelte-app@latest
2. Say yes to everything.
3. cd myNewApp
4. npm run format

Prettier reformats the following files:

    modified:   capacitor.config.ts
    modified:   src/routes/+layout.svelte
    modified:   src/routes/+layout.ts
    modified:   src/routes/+page.svelte
    modified:   src/theme/variables.css
    modified:   svelte.config.js
    modified:   tsconfig.json

At a minimum, I think these should be cleaned up in the repo so that when you create a new project with Prettier, the files are already "prettified."

But it might be good to go ahead and reformat the whole repo with Prettier. I did this locally and it's a huge number of changes, but as far as I know, Prettier shouldn't break anything, so it's something to consider.

[Tommertom]

What would be your preferred prettierrc config? And you think that will apply to everyone?

{
    "semi": false,
    "singleQuote": true,
    "tabWidth": 2,
    "trailingComma": "es5",
    "bracketSpacing": true,
    "svelteSortOrder": "scripts-markup-styles",
    "svelteStrictMode": false,
    "svelteBracketNewLine": true,
    "svelteAllowShorthand": true,
    "arrowParens": "always"
}

?

[edosenseidotcom]

That looks fine to me. I don't have a strong opinion on what the default config should be; it's quite easy to change it if you don't like the default.

But I do think that by default, the project should come pre-linted/prettified.

[edosenseidotcom]

Another option would be to use the .prettierrc that comes bundled with svelte itself.

npm create svelte@latest, choose prettier, get this:

{
        "useTabs": true,
        "singleQuote": true,
        "trailingComma": "none",
        "printWidth": 100,
        "plugins": ["prettier-plugin-svelte"],
        "overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]
}