3. ESlint with Prettier

ESlint with Prettier

  • 梵
    administrators

    Not sure if I noted this already.

    Looks like a good tutorial: https://needlify.com/post/how-to-configure-eslint-and-prettier-with-vscode-ad8d0900

    TLDR,

    • install the VSCode Plugsin, Eslint & Prettier
    • install the dependencies: eslint-config-prettier & eslint-plugin-prettier
    • create or generate .eslint, like:
    "extends": [
        ...
        "prettier"
],
"plugins": [
        ...
        "prettier"
],
"rules": {
        ...
    "prettier/prettier": "error"
}

    created .prettierrc, like

    {
   "semi": true,
   "singleQuote": false,
   "tabWidth": 3,
}

    In the vsCode setting, turn on "formatOnSave" it will use prettier as formatted
    Then in your .vscode/settings.json, add the following, so it autoruns eslint fixes on save.

    { 
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
}
    0