Very newbie question here I m trying to have vs code to auto Serverless Stack #help

Very newbie question here, I’m trying to have vs c...

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?

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

Devin

01/04/2022, 12:28 PM

https://github.com/wesbos/eslint-config-wesbos

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

thdxr

01/04/2022, 1:46 PM

we have some eslint support built into sst - we actually avoid babel

thdxr

01/04/2022, 1:47 PM

We typically suggest configuring it through package.json: https://docs.serverless-stack.com/working-locally#linting--type-checking

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

Daniel Gato

01/04/2022, 2:30 PM

I’m not sure what I’m doing wrong here tbh

thdxr

01/10/2022, 5:47 PM

Hey Daniel were you able to figure this out?

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`

Daniel Gato

01/13/2022, 9:49 PM

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?

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?

Daniel Gato

01/26/2022, 5:43 PM

Daniel Gato

01/26/2022, 5:43 PM

This seems extremely related https://github.com/aws/aws-cdk/issues/18669

Daniel Gato

02/09/2022, 1:14 PM

@thdxr @Frank I changed from js to ts in our project and eslint is now working.

Open in Slack

Previous Next