From 4d62c8667ab65ed422a844a99959388bcc94a250 Mon Sep 17 00:00:00 2001 From: Anton Zdanov Date: Mon, 4 Jun 2018 19:48:38 +0300 Subject: [PATCH 1/6] Update Prettier + TSLint section --- README.md | 48 ++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 48 insertions(+) diff --git a/README.md b/README.md index b0417e25..428f7f58 100644 --- a/README.md +++ b/README.md @@ -439,6 +439,54 @@ For developing with Storybook, read the docs I maintain over here: + + + tslint.json + + + .prettierrc + + + + +

+{
+  "rulesDirectory": ["tslint-plugin-prettier"],
+  "extends": [
+    "tslint:recommended",
+    "tslint-config-prettier"
+  ],
+  "linterOptions": {
+    "exclude": ["node_modules/**/*.ts"]
+  },
+  "rules": {
+    "prettier": true
+  }
+}
+

+ + +

+{
+  "printWidth": 89,
+  "tabWidth": 2,
+  "useTabs": false,
+  "semi": true,
+  "singleQuote": true,
+  "trailingComma": "all",
+  "bracketSpacing": true,
+  "jsxBracketSameLine": false
+}
+

+ + + + ## Working with Non-Typescript Libraries (writing your own index.d.ts) *Not written yet.* From 9046b4856234b735297f65e68d7785278522f3bb Mon Sep 17 00:00:00 2001 From: Anton Zdanov Date: Mon, 4 Jun 2018 19:51:32 +0300 Subject: [PATCH 2/6] fix toc for prettier + tslint --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 428f7f58..273d35f6 100644 --- a/README.md +++ b/README.md @@ -27,7 +27,7 @@ - [Section 4: Misc. Concerns](#section-4--misc-concerns) * [Component/Design System Development](#component-design-system-development) * [Building](#building) - * [Prettier + TSLint](#prettier---tslint) + * [Prettier + TSLint](#prettier--tslint) * [Working with Non-Typescript Libraries (writing your own index.d.ts)](#working-with-non-typescript-libraries--writing-your-own-indexdts-) - [Troubleshooting Handbook: Types](#troubleshooting-handbook--types) * [Union types](#union-types) From 2093a4b21d07f5dc54166a32efa654da45629c2b Mon Sep 17 00:00:00 2001 From: Anton Zdanov Date: Tue, 5 Jun 2018 19:21:40 +0300 Subject: [PATCH 3/6] Add ESLint + TSLint section --- README.md | 77 ++++++++++++++++++++++++++++++++++++++++++++++++++++--- 1 file changed, 74 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 273d35f6..37576a36 100644 --- a/README.md +++ b/README.md @@ -28,6 +28,7 @@ * [Component/Design System Development](#component-design-system-development) * [Building](#building) * [Prettier + TSLint](#prettier--tslint) + * [ESLint + TSLint](#eslint--tslint) * [Working with Non-Typescript Libraries (writing your own index.d.ts)](#working-with-non-typescript-libraries--writing-your-own-indexdts-) - [Troubleshooting Handbook: Types](#troubleshooting-handbook--types) * [Union types](#union-types) @@ -437,9 +438,7 @@ For developing with Storybook, read the docs I maintain over here: +## ESLint + TSLint + +Why? ESLint ecosystem is rich, with lots of different plugins and config files, whereas TSLint tend to lag behind in some areas. + +To remedy this nuisance there is an [eslint-typescript-parser](https://github.com/eslint/typescript-eslint-parser) which tries to bridge the differences between javascript and typescript. It still has some rough corners, but can provide consistent assistance with certain plugins. + + + + + + + + + + +

+ Usage +

+ .eslintrc +

+// Install:
+
+npm i -D typescript-eslint-parser
+
+// And in your ESLint configuration file:
+
+"parser": "typescript-eslint-parser"
+

+{
+  "extends": [
+    "airbnb",
+    "prettier",
+    "prettier/react",
+    "plugin:prettier/recommended",
+    "plugin:jest/recommended",
+    "plugin:unicorn/recommended"
+  ],
+  "plugins": ["prettier", "jest", "unicorn"],
+  "parserOptions": {
+    "sourceType": "module",
+    "ecmaFeatures": {
+      "jsx": true
+    }
+  },
+  "env": {
+    "es6": true,
+    "browser": true,
+    "jest": true
+  },
+  "settings": {
+    "import/resolver": {
+      "node": {
+        "extensions": [".js", ".jsx", ".ts", ".tsx"]
+      }
+    }
+  },
+  "overrides": [
+    {
+      "files": ["**/*.ts", "**/*.tsx"],
+      "parser": "typescript-eslint-parser",
+      "rules": {
+        "no-undef": "off"
+      }
+    }
+  ]
+}
+

+ ## Working with Non-Typescript Libraries (writing your own index.d.ts) *Not written yet.* From 60e7ed83bab484257152b8dd83cee4fed2dabd4b Mon Sep 17 00:00:00 2001 From: Anton Zdanov Date: Wed, 6 Jun 2018 12:25:40 +0300 Subject: [PATCH 4/6] match style for link in eslint + tslint section --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 37576a36..bdc59152 100644 --- a/README.md +++ b/README.md @@ -490,7 +490,7 @@ Example configuration: Why? ESLint ecosystem is rich, with lots of different plugins and config files, whereas TSLint tend to lag behind in some areas. -To remedy this nuisance there is an [eslint-typescript-parser](https://github.com/eslint/typescript-eslint-parser) which tries to bridge the differences between javascript and typescript. It still has some rough corners, but can provide consistent assistance with certain plugins. +To remedy this nuisance there is an [`eslint-typescript-parser`](https://github.com/eslint/typescript-eslint-parser) which tries to bridge the differences between javascript and typescript. It still has some rough corners, but can provide consistent assistance with certain plugins. From f92bf029498d2bb2c3b9009bc2bfb687bd0a8fc8 Mon Sep 17 00:00:00 2001 From: Anton Zdanov Date: Wed, 6 Jun 2018 18:56:37 +0300 Subject: [PATCH 5/6] Add external repo for tslint + prettier + eslint An example repository for integrating prettier, eslint and tslint together. --- README.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/README.md b/README.md index bdc59152..f32b5f06 100644 --- a/README.md +++ b/README.md @@ -486,6 +486,8 @@ Example configuration:

+An example github repository with a project showing how to integrate [prettier + tslint + create-react-app-ts](https://github.com/azdanov/tslint-eslint-crats). + ## ESLint + TSLint Why? ESLint ecosystem is rich, with lots of different plugins and config files, whereas TSLint tend to lag behind in some areas. @@ -558,6 +560,8 @@ npm i -D typescript-eslint-parser +An example github repository with a project showing how to integrate [eslint + tslint + create-react-app-ts](https://github.com/azdanov/tslint-eslint-crats). + ## Working with Non-Typescript Libraries (writing your own index.d.ts) *Not written yet.* From 78fad006411a69dc02762233bea5062d01e9f9de Mon Sep 17 00:00:00 2001 From: tsiq-swyx <35976578+tsiq-swyx@users.noreply.github.com> Date: Wed, 6 Jun 2018 13:03:18 -0400 Subject: [PATCH 6/6] adding attribution! --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index f32b5f06..dc31184a 100644 --- a/README.md +++ b/README.md @@ -438,6 +438,8 @@ For developing with Storybook, read the docs I maintain over here: pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.

Alternative Proxies: