保持开发者之间的JS格式代码一致？

Question

We keep having problem with Javascript developers are using different code format on the Editors. Some developers use VSCode, Sublime or PHPStorm. We are getting inconsistent code formatting when the developers create a PR (Github).

Is there a way a developer can run a command (npm format) which will format the code automatically. And also CI will do code format check?

Answer 1

If you're just looking for a code formatter, Prettier is a great option. Using Prettier, you can have a central configuration (eg, 4 spaced tabs, double quotes, etc.), and running a single command will clean your files.

You can extend this with Husky , which is my go-to choice for git hooks. Then, you can set up a pre-commit hook which will automatically clean your files using Prettier before committing any new code.

You can add the following to your package.json after adding Prettier and Husky as devDependencies :

{
  "scripts": {
    "prettier-format": "prettier --write 'src/**/*.js'"
  },
  "husky": {
    "hooks": {
      "pre-commit": "npm run prettier-format"
    }
  }
}

You can also use Onchange, which can be configured to run Prettier after saving any file changes: https://prettier.io/docs/en/watching-files.html

Answer 2

You can try Nx , it handles for you Prettier, TSLint and many many other stuff. Then you can run nx format:check (it can be also embedded in a pipeline easily by running npm run format:check ) to check your formatting. nx format:write / npm run format:write will write the rules for you. Works really good in combination with VSCode option Editor: Format on Save turned on , highly recommending.