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.

Sign up for GitHub

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

feat: add prettier to project #122

Closed
wants to merge 6 commits into from
Closed

feat: add prettier to project #122

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
64000c2
Merge pull request #112 from LetsGetTechnical/develop
shashilo Apr 3, 2024
343cd06
feat: add prettier to project and update README
ryandotfurrer Apr 10, 2024
0e9daac
Update README.md with proper image link
ryandotfurrer Apr 10, 2024
ce3d815
Update README.md again with new image URL for Prettier
ryandotfurrer Apr 11, 2024
9127860
Attempting to fix vercel deployment issue
ryandotfurrer Apr 12, 2024
8dcc631
Merge branch 'develop' into feat_rf_add-prettier
ryandotfurrer Apr 12, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions . prettierignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
.github/
*.config.js
.prettierrc.js
*.json
*.md
25 changes: 24 additions & 1 deletion README.md
View file
Open in desktop
Copy link
Contributor

Choose a reason for hiding this comment

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

Image is not viewable in README.md, returns Invalid upstream response (403) when clicking on image link.

Also when I tried to follow the README instructions, I get the following error for the editor.defaultFormater property when trying to put "esbenp.prettier-vscode" as its value: Value is not accepted

  • Tried putting it in dart object
  • Tried putting it in settings.json object

Screenshot 2024-04-10 065831
Screenshot 2024-04-10 065852

Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,29 @@ Run Storybook in the project root
npm run storybook
```

## Prettier

Install dependencies if you have not done so already.

```
pnpm i
```

Search for and open `settings.json` by pressing `cmd+shift+p` on MacOS or `ctrl+shift+p` on Windows.

> [!IMPORTANT]
> There may be multiple options, ensure you select the option that says "Open User Settings (JSON)

![Screenshot of VS Code search results for "settings.json" with the User Settings JSON option highlighted.](https://res.cloudinary.com/ryan-furrer/image/upload/v1712793797/Vscode_settings.json_wuoqgc.png)

Add the following lines to your `settings.json`

```
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true,
```

Open a file and save it, you should see formatting changes made as soon as you save it!
## React Testing Library (RTL) && Jest

Run RTL && Jest in the project root
Expand All @@ -125,4 +148,4 @@ Run single Playwright tests

```
pnpm exec playwright test (name of file)
```
```
Loading
Loading