💻
Building and hosting a WebApp
  • Getting started
  • Project setup
    • Requirements
    • Files organisation
    • Lerna
    • Linter
    • Prettier
    • GitHook
    • Testing
    • Conclusion
  • Backend
    • Files organisation
    • Environment config
    • Express API
    • Security
    • Database
    • GraphQL
    • User authentication
    • Conclusion
  • Frontend
    • Create React App
    • Files organisation
    • Styles
    • Apollo Hooks
    • Form management
    • User authentication
    • Writing tests
    • Types generation
    • Conclusion
  • DevOps
    • CI/CD
    • AWS
      • Managing secrets
      • Pricing
      • RDS
      • S3
      • Route53
      • CloudFront
      • Serverless
      • Security
      • CloudFormation
    • Conclusion
  • 🚧Stripe payment
  • 🚧File upload
Powered by GitBook
On this page

Was this helpful?

  1. Project setup

Prettier

Remaining consistent isn't easy when the team grows. A lot of code formatting issues brought up by the linter can be fixed automatically. That's Prettier.

$ yarn add prettier

Change index.ts to following code:

index.ts
const printFizz = number => {
        if (!Boolean(number % 3)) 
        {
return "fizz";
    }
};

then run

$ prettier --write packages/api/index.ts

The file has been formatted correctly:

index.ts
const printFizz = number => {
    if (!Boolean(number % 3)) {
        return "fizz";
    }
};

Avoid TSLint conflict

yarn add tslint-config-prettier -D

Update tslint.json

tslint.json
{
  "defaultSeverity": "error",
  "extends": ["tslint:recommended", "tslint-config-prettier"],
  "jsRules": {},
  "rules": {},
  "rulesDirectory": []
}

PreviousLinterNextGitHook

Last updated 5 years ago

Was this helpful?