What will be done?

We’ll learn how to configurate a yarn workspace monorepo to use prettier and eslint with typescript in our projects. A Monorepo project provides to you a global configuration that facilitates scalability, and prevent duplicate libraries installed. In addition to facilitating the maintenance and organization of the code.

Creating a monorepo

Start by creating a folder where your project will be located, and initializing yarn:

mkdir my-monorepo-project cd my-monorepo-project yarn init -y 

Also, this project will have two sides, backend and fronted. So, i'll create two folders, cli and api:

mkdir cli mkdir api 

Now, in package.json add two configuration to use a monorepo. The private define if our parent path will be published, and workspaces define our paths.

"workspaces": [ "cli", "api" ], "private": true, 

Installing prettier and eslint

Now, install prettier and eslint in all the workspaces with:

yarn add -D prettier eslint @typescript-eslint/eslint-plugin @typescript-eslint/parser 

With it installed, create two configurate files, .prettierrc and .eslintrc:

//.prettierrc { "semi": false, "trailingComma": "none", "singleQuote": true, "printWidth": 120, "tabWidth": 2, "arrowParens": "avoid" } 

//.eslintrc { "parser": "@typescript-eslint/parser", "plugins": ["@typescript-eslint"], "extends": ["eslint:recommended", "plugin:@typescript-eslint/recommended"], "parserOptions": { "ecmaVersion": 2018, "sourceType": "module" }, "rules": { "no-unused-vars": "off" } } 

Now, all your code inside cli and api will configurate with eslint and prettier formater, enjoy!!