https://serverless-stack.com/ logo
#help
Title
# help
d

Daniel Gato

01/04/2022, 11:52 AM
Very newbie question here, I’m trying to have vs code to auto correct my code with eslint on save. So far I added a file
.vscode/settings.json
in the root folder with this:
Copy code
{
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
  "eslint.validate": ["javascript"],
 }
But this is still not converting ' to ” (or the other way) and my tabs are still not formatted. What am I missing here?
d

Devin

01/04/2022, 12:27 PM
Typically I use eslint in concert with prettier. My reference, since it's a little goofy to get wired up is
d

Daniel Gato

01/04/2022, 1:32 PM
Thanks. I think I got it to work with those steps: 1. use the eslint cli to create a
.eslintrc.yml
2. added this packages:
eslint
,
eslint-config-airbnb-base
,
eslint-plugin-import
, and
babel-eslint
(the last one is to avoid eslint complaining about class variables) config file:
Copy code
env:
  es2021: true
  node: true
  browser: true
parserOptions:
  ecmaVersion: 12
  sourceType: module
rules:
  no-new: off
  import/prefer-default-export: off
parser: babel-eslint
extends:
  - airbnb-base
t

thdxr

01/04/2022, 1:46 PM
we have some eslint support built into sst - we actually avoid babel
We typically suggest configuring it through package.json: https://docs.serverless-stack.com/working-locally#linting--type-checking
d

Daniel Gato

01/04/2022, 2:30 PM
The problem without babel is this one:
Copy code
env:
  es2021: true
  node: true
  browser: true
parserOptions:
  ecmaVersion: 12
  sourceType: module
rules:
  no-new: off
  import/prefer-default-export: off
extends:
  - airbnb-base
I’m not sure what I’m doing wrong here tbh
t

thdxr

01/10/2022, 5:47 PM
Hey Daniel were you able to figure this out?
d

Daniel Gato

01/10/2022, 5:50 PM
Not really, I settled down to just adding some rules to the package.json and removed
eslint-config-airbnb-base
and`eslint-plugin-import`
I’m actually trying it again @thdxr I have this on my package JSON:
Copy code
{
  "name": "...",
  "private": true,
  "eslintConfig": {
    "extends": [
      "serverless-stack",
      "airbnb-base",
      "prettier"
    ],
    "plugins": [
      "prettier"
    ],
  },
  "devDependencies": {
    "eslint": "^7.32.0",
    "eslint-config-airbnb-base": "^15.0.0",
    "eslint-config-prettier": "^8.3.0",
    "eslint-plugin-prettier": "^4.0.0",
    "prettier": "^2.5.1"
  },
  "dependencies": {
    "@aws-cdk/assert": "1.138.0",
    "@aws-cdk/aws-iam": "1.138.0",
    "@aws-cdk/aws-lambda": "1.138.0",
    "@aws-cdk/aws-logs": "1.138.0",
    "@aws-cdk/aws-s3": "1.138.0",
    "@aws-cdk/core": "1.138.0",
    "@serverless-stack/cli": "0.57.0",
    "@serverless-stack/resources": "0.57.0",
    "aws-sdk": "^2.1049.0",
  }
}
But my files don’t have any restrictions such as line length (that I know Airbnb guidelines have) Is there something that is obviously wrong?
f

Frank

01/26/2022, 5:38 PM
@Daniel Gato I’m trying to reproduce this on my end. Is ur project in TS or JS?
d

Daniel Gato

01/26/2022, 5:43 PM
JS
This seems extremely related https://github.com/aws/aws-cdk/issues/18669
@thdxr @Frank I changed from js to ts in our project and eslint is now working.