Linter support

[crazy4groovy]

A crucial part for me to edit code is using a linter. Does stackblitz support linters and highlighting? A plugin system would be fantastic.

[EricSimons]

@crazy4groovy this is def something we're planning to add asap — would love to hear more about what you think that this should look like!

[vinchauhan]

how about adding Emmet too..

[skylize]

@EricSimons

would love to hear more about what you think that this should look like!

You should enable eslint to behave basically the same as the ESLint Extension in desktop VSCode. (Except be a bit more sparing on custom settings. Try to get out of the way as much as possible and let ESLint and whatever plugins do all the work.)

Or, I guess, TSLint for the TypeScript-based project types, but I will explain further based on looking at the JS projects.

• Starter projects include eslint package by default, plus project specfic addons, i.e. eslint-plugin-react and babel-eslint for React projects.

• Starter projects include a .eslintrc.json, or the package.json includes an eslintConfig prop.

• Provide sane defaults, that are strict enough to be helpful, but not overly-opinionated, by just relying on the "recommended" settings from the included packages. So a React project default config might look something like this.

  ( Note: I am explicitly overriding one rule from react/recommended, because forced use of propTypes can feel insanely draconian when trying to build quick prototypes, as would most often be the case on this site.)

  {
    "parser": "babel-eslint",
    "env": {
      "browser": true,
      "node": true,
      "es6": true
    },
    "extends": [
      "eslint:recommended",
      "plugin:react/recommended"
    ],
    "parserOptions": {
        "sourceType": "module",
        "ecmaVersion": 2017
    },
    "rules": {
      "react/prop-types": "off"
    }
  }    

• Because eslint is easily customizable with a config file, and extensible through additional npm packages, people would be able to customize as they see fit with no friction, and have no good reason to complain if they disagree with the devs' choice of coding style.

[Misiu]

@EricSimons any news or ETA? TSLint would really be helpful. Many (including me) are using StackBlitz to learn typescript, so any hints how to improve code are more than helpfull :)

[mohsen1]

Having support for ESLint would make it super easy to report bugs in ESLint plugins

[kc0tlh]

Good News: with the arrival of our new VS Code editor supports 3rd party VS Code extensions including ESlint, TSlint and many, many more!

Additional context on extensions in Github issue #3

Thanks @crazy4groovy, @vinchauhan, @skylize, @Misiu, and @mohsen1 for the product feedback over the years 🙏🏻