Skip to content
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

Added Prettier as source code formatter #50

Merged
merged 3 commits into from
Nov 26, 2021
Merged

Added Prettier as source code formatter #50

merged 3 commits into from
Nov 26, 2021

Conversation

mqnguyen5
Copy link
Contributor

@mqnguyen5 mqnguyen5 commented Nov 8, 2021

Fixes #24.

Current progress:

  • added prettier to dependencies
  • added prettier config file
  • added prettier ignore file to skip anything we don't want touched
  • changed npm scripts to include prettier
  • added git hook with Husky to run prettier on every commit
  • added a .vscode/ directory and include the prettier extension in the list of suggestions
  • ran prettier over the entire code base so it gets formatted

@mqnguyen5 mqnguyen5 marked this pull request as ready for review November 8, 2021 18:36
@mqnguyen5
Copy link
Contributor Author

mqnguyen5 commented Nov 8, 2021

This PR is ready for review, but I haven't finish all the tasks yet and need some feedback. I'm a bit unsure about the files/directory included inside .prettierignore. Can someone take a look and let me know what I'm missing?

.prettierignore Show resolved Hide resolved
@aserputov
Copy link
Contributor

aserputov commented Nov 8, 2021

@mqnguyen5 LGTM!
Link

@mqnguyen5
Copy link
Contributor Author

I have included some changes, specifically:

  • added a .vscode/ directory and include the prettier extension in the list of suggestions
  • ran prettier over the entire code base so it gets formatted

Please have a look and let me know if I need to fix anything.

Copy link
Contributor

@humphd humphd left a comment

Choose a reason for hiding this comment

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

Most of this looks good, but there are a few places that I don't understand what it's doing.

I also wonder if we should wait to do this until after all the other PRs land for 0.3, since this will be pretty disruptive to everyone's current work.

docs/A-Introduction/information.md Show resolved Hide resolved
.vscode/extensions.json Outdated Show resolved Hide resolved
* Exa or E (=1024P): 1 Exabyte = 1024 * 1024 * 1024 * 1024 * 1024 * 1024 bytes ~ 10<sup>18</sup> bytes
- Kilo or k (=1024): 1 Kilobyte = 1024 bytes ~ 10<sup>3</sup> bytes
- Mega or M (=1024k): 1 Megabyte = 1024 \* 1024 bytes ~ 10<sup>6</sup> bytes
- Giga or G (=1024M): 1 Gigabyte = 1024 _ 1024 _ 1024 bytes ~ 10<sup>9</sup> bytes
Copy link
Contributor

Choose a reason for hiding this comment

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

But look at this change, it's changed * to _ which is semantically not the same thing. I don't understand it. I wonder if we need to embed this code in backticks to have it not get changed?

Copy link
Contributor Author

@mqnguyen5 mqnguyen5 Nov 9, 2021

Choose a reason for hiding this comment

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

Somehow Prettier thought the * in 1024 * 1024 * 1024 as an indication for bulleted list or something and changed it into _.

@mqnguyen5
Copy link
Contributor Author

For the Prettier formatting bug, I just reverted the formatting commit. I think we should double check the special characters used in the docs, specifically in docs/A-Introduction/information.md. We can either use \ to escape the special characters, or wrap the lines of code in backticks.

For the extensions comment by @Kevan-Y and based on the suggestion of @humphd , I removed editorconfig.editorconfig and dbaeumer.vscode-eslint.

@Kevan-Y
Copy link
Contributor

Kevan-Y commented Nov 9, 2021

For the Prettier formatting bug, I just reverted the formatting commit. I think we should double check the special characters used in the docs, specifically in docs/A-Introduction/information.md. We can either use \ to escape the special characters, or wrap the lines of code in backticks.

In my opinion, I think the best option is to escape those characters. We will have to check each .md file and escape special characters.

For the extensions comment by @Kevan-Y and based on the suggestion of @humphd , I removed editorconfig.editorconfig and dbaeumer.vscode-eslint.

Looks good. Thanks

@mqnguyen5
Copy link
Contributor Author

In my opinion, I think the best option is to escape those characters. We will have to check each .md file and escape special characters.

Good point. Since we have a lot of files that need formatting, I think we can file a separate issue for it, and merge what we have at the moment:

  • added prettier to dependencies
  • added prettier config file
  • added prettier ignore file to skip anything we don't want touched
  • changed npm scripts to include prettier
  • added git hook with Husky to run prettier on every commit
  • added a .vscode/ directory and include the prettier extension in the list of suggestions

@humphd what do you think about this?

@humphd
Copy link
Contributor

humphd commented Nov 9, 2021

The minute we land the prettier stuff, we also need to format the whole tree at the same time. We have to be ready to deal with the edge cases before this goes in.

I would file issues on the specific things that Prettier is breaking, get those fixed and merged, rebase this, and then run prettier over the whole tree and land.

@mqnguyen5
Copy link
Contributor Author

mqnguyen5 commented Nov 9, 2021

Alright, I'll ran the docs against prettier again, and file issues explaining what to fix. Hopefully we can get it done by today.

@mqnguyen5
Copy link
Contributor Author

@humphd I have filed an issue for the Prettier bug at #56. Hopefully we can get everyone to finish other PRs so we can merge this.

@humphd
Copy link
Contributor

humphd commented Nov 19, 2021

A note that we'll circle back on this early next week once we've cleared the current PRs.

@humphd
Copy link
Contributor

humphd commented Nov 22, 2021

@mqnguyen5 let's rebase this and re-run so we can review it again.

@mqnguyen5
Copy link
Contributor Author

Will do.

	* installed prettier
	* added prettier config file and defined several formatting rules
	* added prettier ignore file
	* added scripts for running prettier
	* installed husky
	* installed pretty-quick and added script for pre-commit hook
	* added pre-commit hook
	* added vscode integration with settings and suggested extensions
@humphd
Copy link
Contributor

humphd commented Nov 25, 2021

@mqnguyen5 we just merged the last of the PRs that were blocking this, do you want to rebase and try running it again to see how it is? I think we can merge soon.

@mqnguyen5
Copy link
Contributor Author

@humphd I just pull the latest changes and run them through Prettier.

Copy link
Contributor

@humphd humphd left a comment

Choose a reason for hiding this comment

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

This looks great, I have no concerns. Well done.

Copy link
Contributor

@Kevan-Y Kevan-Y left a comment

Choose a reason for hiding this comment

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

LGTM

@humphd
Copy link
Contributor

humphd commented Nov 26, 2021

@CameronGray1210 I'm going to merge this, and it will mean that you need to pull from the upstream repo and then re-run yarn to install the new dependencies (including prettier). This change will automatically cause git to trigger the formatting when you commit anything new, so as long as people have run yarn before they git commit, it should remain consistent.

In a follow-up, I'll file an issue to add the prettier-check step to our CI for pull requests, so we can spot people forgetting to do this and get them to fix before we merge.

Also note: this change will recommend that people install the following VSCode extensions, which will help with the editing process, and run Prettier every time you save:

@humphd humphd merged commit dbe13ab into Seneca-ICTOER:main Nov 26, 2021
@humphd
Copy link
Contributor

humphd commented Nov 26, 2021

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

Successfully merging this pull request may close these issues.

Add Prettier as source code formatter
4 participants