Prettier usage

Hey all,

Since I started working on git-point, I’ve always been bugged by prettier, leaving me with staged modified files after I commit & push:

🍺  ~/git-point (test-pretty)*$ vi root.store.js
🍺  ~/git-point (test-pretty)*$ git diff root.store.js
diff --git a/root.store.js b/root.store.js
index f45bb1b..c3e683e 100644
--- a/root.store.js
+++ b/root.store.js
@@ -10,7 +10,7 @@ import { rootReducer } from './root.reducer';
 const getMiddleware = () => {
   const middlewares = [reduxThunk];

-  if (__DEV__) {
+        if (__DEV__) {
     if (process.env.LOGGER_ENABLED) {
       middlewares.push(createLogger());
     }
🍺  ~/git-point (test-pretty)*$ git commit -m "chore: test prettier" root.store.js
husky > npm run -s precommit (node v8.5.0)

 ✔ Running tasks for *.js
husky > npm run -s commitmsg (node v8.5.0)

⧗   input: chore: test prettier
✔   found 0 problems, 0 warnings

[test-pretty 0abc139] chore: test prettier
🍺  ~/git-point (test-pretty)*$ git push -u origin test-pretty
Counting objects: 1, done.
Writing objects: 100% (1/1), 189 bytes | 189.00 KiB/s, done.
Total 1 (delta 0), reused 0 (delta 0)
To github.com:machour/git-point.git
 * [new branch]      test-pretty -> test-pretty
Branch test-pretty set up to track remote branch test-pretty from origin.
🍺  ~/git-point (test-pretty)*$ git status
On branch test-pretty
Changes to be committed:
  (use "git reset HEAD <file>..." to unstage)

	modified:   root.store.js

After some digging into that issue with the precious help of @chinesedfan, it seems to be caused by the fact that I have other modified files (that I don’t want to commit) and that I don’t use git add in my workflow.

Instead, working on existing files, I pass them as parameter in my git commit call.

The way it’s implemented right now, it seems to be working only on explicitly git added files:

  "lint-staged": {
    "*.js": [
      "prettier --single-quote --trailing-comma es5 --write",
      "git add",
      "eslint --cache --max-warnings 0"
    ]
  },

That git add doesn’t know what files I want and don’t want in my commit, so it is ran on files that were git added by hand, which is none in my case.

Considering that I have this issue, and that I simply hate when a process modify my commit without me knowing it and seeing exactly what it does, I tried yesterday to have VS Code do the prettier thing on file save.

I was able to do that by installing a plugin, and adding a prettier section in my package.json file for VSCode to read. (I did slightly change the options, that’s why my PR had weird changes).

Could we consider using the IDE with written options in package.json instead of that lint-staged thingy that doesn’t work without git add ? We could have a small documentation about how to setup majors IDE to work on GitPoint.

Or I can try to force myself to use git add on every file I want to commit before doing my actual commit (but I already forsee myself doing a machinal git add -A and then banging my head on my desk 😄 )

Opinions?

[chinesedfan]

Right. Hope this time the styled-component refactor will prettier each file. 😆

[machour]

@chinesedfan no worries, there still was a problem with my commit 😉

Personally, I prefer not to have trailing comas in functions arguments, as this kind of make visually no sense to me. If a function takes 4 args, I should have 3 comas.

Here’s the configuration I used for prettier in my commit: (I included settings that are defaults to have an explicit config across configs)

{
  "printWidth": 80,
  "tabWidth": 2,
  "useTabs": false,
  "semi": true,
  "singleQuote": true,
  "trailingComma": "es5",
  "bracketSpacing": true,
  "jsxBracketSameLine": true,
}