Skip to content

Add Prettier config to app #8157

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 8 commits into
base: main
Choose a base branch
from

Conversation

nickserv
Copy link
Contributor

@nickserv nickserv commented Dec 12, 2019

Rationale

This monorepo has a Prettier config that affects formatting of all files, including the official templates. However, because this config isn't included in the templates, running Prettier (as recommended in the docs) will change the formatting of the app, which can be confusing or inconvenient.

Changes

Modified the init script to copy the monorepo's Prettier config to package.json (for any template). In the future we may want to make this extensible if third party templates need to set their own Prettier configs.

Testing

Created an example app with yarn create-react-app my-app, confirming that the Prettier config was created in package.json and running Prettier does not reformat the files (as the formatting is already correct).

@stale
Copy link

stale bot commented Jan 11, 2020

This pull request has been automatically marked as stale because it has not had any recent activity. It will be closed in 5 days if no further activity occurs.

@stale stale bot added the stale label Jan 11, 2020
@nickserv
Copy link
Contributor Author

This is still an issue.

@stale stale bot removed the stale label Jan 11, 2020
@nickserv
Copy link
Contributor Author

nickserv commented Feb 5, 2020

There haven't been any conflicts. Is there anything I need to do to get this to a mergeable or reviewable state?

@stale
Copy link

stale bot commented Mar 6, 2020

This pull request has been automatically marked as stale because it has not had any recent activity. It will be closed in 5 days if no further activity occurs.

@stale stale bot added the stale label Mar 6, 2020
@nickserv
Copy link
Contributor Author

nickserv commented Mar 6, 2020

This pull request is still working and awaiting review.

@nickserv

This comment was marked as outdated.

Comment on lines +213 to +214
arrowParens: 'avoid',
singleQuote: true,
Copy link
Contributor Author

@nickserv nickserv Jun 23, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is what I would recommend to beginners of React and Prettier now, though I'd like opinions before committing it:

Suggested change
arrowParens: 'avoid',
singleQuote: true,
semi: false,
trailingComma: 'all',

Rationale

Option Notes
arrowParens Prettier now sets this on by default, as it makes it easier to add parameters and types, which is especially helpful for beginners
singleQuote Prettier still uses double quotes for JSX, so it makes more sense to be consistent with the defaults
semi Getting rid of semicolons makes it easier to read, write, and reorder lines of code, and Prettier already fixes the issues with ASI
trailingComma Historically Prettier defaulted to ES5, but we use use Babel, so we can use newer syntax without worrying about browser support

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I've published prettier-config-nick if anyone would like to use it before this is merged.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants