I gathered all the info needed to setup ESLint in VS Code for svelte in 2021

What took me 3 hours to puzzle it together, can be done in 5 minutes: Configuring EsLint to actually produce better svelte code in VSCode.

Go to your projects workspace folder, install the CORRECT svelte plugin (hint: with 3), create a .eslintrc json file and finally apply the following settings to VS Code. Then restart and hopefully you will get lots of warnings — to make your code better and cleaner.

Don’t forget to install the ESLint extension.

Here starts the console stuff (not sure how to proper format it, my first post here.

## In your vscode svelte workspace folder
npm install — save-dev eslint-plugin-svelte3
nano .eslintrc.json
----clip_here_start
{ 
 “env”: { 
 “browser”: true,
 "commonjs": true,
 "es6": true
}, 
 “parserOptions”: {
   “ecmaVersion”: 9,
   “ecmaFeatures”: { 
     “impliedStrict”: true 
   }, 
   "sourceType”: “module” 
 }, 
 “plugins”: [ 
   “svelte3” 
 ], 
 “overrides”: [ 
   { 
    “files”: [ 
       “*.svelte” 
     ], 
    “processor”: “svelte3/svelte3” 
   } 
 ], 
 “rules”: { 
   “semi”: “error”, 
   “no-console”: 0 
 }, 
 “extends”: “eslint:recommended” 
}
----clip_here_end

In your VS Code settings, ether manually or insert into .vscode/settings.json

{
  // ESlint for VS Code extension
  "eslint.options": {
      "ecmaVersion": 9,
      "max-len": [
         {
         "code": 450,
         "tabWidth": 2,
         "ignoreUrls": true
         }
      ],
      "ecmaFeatures": {
         "modules": true,
         "spread" : true,
         "restParams" : true
      },
   },
   "eslint.format.enable": true,
   "eslint.validate": [
      "svelte",
      "javascript",
      "css",
   ],
   "eslint.probe": [
      "svelte",
      "javascript",
      "css",
   ],
   "eslint.codeAction.showDocumentation": {
      "enable": true
   },
  
  // Svelte for VS Code extension
  "svelte-intellisense.trace.server": "verbose",
  "svelte.plugin.svelte.format.enable": true,
  "svelte.plugin.svelte.format.config.svelteSortOrder": "options-markup-styles-scripts",
  "svelte.plugin.css.completions.enable": true,
  "svelte.plugin.css.diagnostics.enable": true,
  "svelte.plugin.svelte.diagnostics.enable": true,
  "svelte.plugin.typescript.diagnostics.enable": false,
  "[svelte]": {
    "editor.formatOnSave": true,
    "editor.defaultFormatter": "svelte.svelte-vscode",
    "editor.formatOnPaste": true,
    "editor.formatOnType": true,
  },
}

As you really got till here: Maybe you are interrested in the svelte code: Its a frontend to a smartcontract on the Energi3 blockchain.

https://github.com/kimxilxyong/Energi-Smart-Contract-Tutorial/tree/master/svelte-faucet