From 51806b8d860ed853e7935fbbbd5d32fbdd716e6e Mon Sep 17 00:00:00 2001 From: Justin Fagnani Date: Wed, 18 Dec 2019 13:07:49 -0800 Subject: [PATCH] Reccomend lit-plugin (#4) --- .vscode/extensions.json | 13 +++++++++++++ README.md | 14 +++++++++++++- 2 files changed, 26 insertions(+), 1 deletion(-) create mode 100644 .vscode/extensions.json diff --git a/.vscode/extensions.json b/.vscode/extensions.json new file mode 100644 index 0000000..4bfdd30 --- /dev/null +++ b/.vscode/extensions.json @@ -0,0 +1,13 @@ +{ + // See https://go.microsoft.com/fwlink/?LinkId=827846 to learn about workspace recommendations. + // Extension identifier format: ${publisher}.${name}. Example: vscode.csharp + + // List of extensions which should be recommended for users of this workspace. + "recommendations": [ + "runem.lit-plugin" + ], + // List of extensions recommended by VS Code that should not be recommended for users of this workspace. + "unwantedRecommendations": [ + + ] +} diff --git a/README.md b/README.md index 422743e..9159758 100644 --- a/README.md +++ b/README.md @@ -47,10 +47,22 @@ To run the dev server and open the project in a new browser tab: ```bash npm run serve ``` +## Editing + +If you use VS Code, we highly reccomend the [lit-plugin extension](https://marketplace.visualstudio.com/items?itemName=runem.lit-plugin), which enables some extremely useful features for lit-html templates: + - Syntax highlighting + - Type-checking + - Code completion + - Hover-over docs + - Jump to definition + - Linting + - Quick Fixes + + The project is setup to reccomend lit-plugin to VS Code users if they don't already have it installed. ## Linting -Linting of TypeScript files is provided by [ESLint](eslint.org) and [TypeScript ESLint](https://github.com/typescript-eslint/typescript-eslint). In addition, [lit-analyzer](https://www.npmjs.com/package/lit-analyzer) is used to type-check and lint lit-html templates. +Linting of TypeScript files is provided by [ESLint](eslint.org) and [TypeScript ESLint](https://github.com/typescript-eslint/typescript-eslint). In addition, [lit-analyzer](https://www.npmjs.com/package/lit-analyzer) is used to type-check and lint lit-html templates with the same engine and rules as lit-plugin. The rules are mostly the recommended rules from each project, but some have been turned off to make LitElement usage easier. The recommended rules are pretty strict, so you may want to relax them by editing `.eslintrc.json` and `tsconfig.json`.