Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[vue-tsc] How to use with lint-stage #686

Closed
seho-dev opened this issue Nov 11, 2021 · 15 comments
Closed

[vue-tsc] How to use with lint-stage #686

seho-dev opened this issue Nov 11, 2021 · 15 comments
Labels
question Further information is requested

Comments

@seho-dev
Copy link

I want to use vue-tsc for type checking in vue.
I want to use lint-stage now, but vue-tsc can't seem to find my tsconfig.json

  "lint-staged": {
    "*.{ts,tsx}": [
      "prettier --write",
      "eslint --fix",
      "tsc --noEmit --pretty false --skipLibCheck",
      "git add"
    ],
    "*.{json,js,jsx}": [
      "prettier --write",
      "eslint --fix",
      "git add"
    ],
    "*.vue": [
      "prettier --write",
      "eslint --fix",
      "vue-tsc --noEmit --skipLibCheck",
      "git add"
    ]
  },

I want to verify only the vue file in the temporary storage area. Do you know how to do it?

@seho-dev
Copy link
Author

@Shinigami92
Copy link
Collaborator

Are you sure that this will work?
As far as I know lint-stage passes each touched file individually to the command.
But vue-tsc needs the whole context starting from src/main.ts, does it?
In worse case you start vue-tsc for each file and if you have 100 files, it will check the project 100 times

@johnsoncodehk johnsoncodehk added help wanted Extra attention is needed question Further information is requested labels Nov 11, 2021
@seho-dev
Copy link
Author

yes, i agree

I know that vue-tsc will recheck the entire program, but is there a better way to check vue files?

@Shinigami92
Copy link
Collaborator

Maybe just use precommit 🤔

See lint-staged/lint-staged#185

@seho-dev
Copy link
Author

But what I use now is pre_commit 😭
Does vue-tsc plan to do type checking on a batch of vue files in the future?

@johnsoncodehk
Copy link
Member

@1018715564 Please treat vue-tsc as just tsc, maybe tsc can specify files in cli, I think there have been some discussions: lint-staged/lint-staged#468

@johnsoncodehk johnsoncodehk removed the help wanted Extra attention is needed label Nov 12, 2021
@seho-dev
Copy link
Author

I already have an optimal lint-stage configuration. If anyone needs it, just use vue-tsc as tsc.

// lint-staged.config.js
module.exports = {
  '*.{ts,tsx}': ['prettier --write', 'eslint --fix', 'tsc --noEmit'],
  '*.vue': ['prettier --write', 'eslint --fix', 'vue-tsc --noEmit'],
  '*.{json,js,jsx}': ['prettier --write', 'eslint --fix']
}
 "scripts": {
   "lint-staged": "lint-staged",
 }

@joker77877
Copy link

I already have an optimal lint-stage configuration. If anyone needs it, just use vue-tsc as tsc.

// lint-staged.config.js
module.exports = {
  '*.{ts,tsx}': ['prettier --write', 'eslint --fix', 'tsc --noEmit'],
  '*.vue': ['prettier --write', 'eslint --fix', 'vue-tsc --noEmit'],
  '*.{json,js,jsx}': ['prettier --write', 'eslint --fix']
}
 "scripts": {
   "lint-staged": "lint-staged",
 }

This configuration is still wrong.

@seho-dev
Copy link
Author

seho-dev commented Dec 1, 2021

I run this configuration successfully without errors; you can send out the error to see

@joker77877
Copy link

This is your demo.
image

@seho-dev
Copy link
Author

seho-dev commented Dec 2, 2021

This is your demo. image

please https://github.com/seho-code-life/project_template/issues/new

It has nothing to do with volar, we can change a place

@ningrunting
Copy link

Any update, I still have same issue with lint-stage

@Yill625
Copy link

Yill625 commented Jan 17, 2022

it's ok!
vue-tsc version 0.29.3

//.lintstagedrc.js
const fs = require('fs')

module.exports = {
  'src/**/*.{js,jsx,vue,ts,tsx}': ['yarn lint'],
  '*.{vue,ts}': [
    () => {
      return `vue-tsc --noEmit --skipLibCheck`
    },
  ],
}

@Roc-zhou
Copy link

Roc-zhou commented Aug 12, 2022

我想使用 vue-tsc 在 vue 中进行类型检查。 我现在想使用 lint-stage,但是 vue-tsc 似乎找不到我的 tsconfig.json

  "lint-staged": {
    "*.{ts,tsx}": [
      "prettier --write",
      "eslint --fix",
      "tsc --noEmit --pretty false --skipLibCheck",
      "git add"
    ],
    "*.{json,js,jsx}": [
      "prettier --write",
      "eslint --fix",
      "git add"
    ],
    "*.vue": [
      "prettier --write",
      "eslint --fix",
      "vue-tsc --noEmit --skipLibCheck",
      "git add"
    ]
  },

我只想验证临时存储区的vue文件。你知道怎么做吗?

"scripts": {
"lint": "vue-tsc --noEmit && eslint --ext .vue,.js,.ts,.jsx,.tsx --fix",
},

"lint-staged": {
"*.{js,vue,ts,jsx,tsx}": [
"prettier --write",
"npm run lint"
]
}

@aalexlin
Copy link

aalexlin commented Sep 7, 2022

See lint-staged/lint-staged#468 (comment)

steadygaze added a commit to steadygaze/frame-randomizer that referenced this issue May 17, 2023
Conceptually, it can't run on files individually (though I would be
happy to be proven wrong on this), therefore it ends up being broken in
lint-staged when I try it. Just run it separately, even if it's a little
slower.

See vuejs/language-tools#686

Running tsc per-file might work with tsc-files, but that didn't work due
to Nuxt doing something clever that I don't have the patience to figure
out.
steadygaze added a commit to steadygaze/frame-randomizer that referenced this issue May 17, 2023
Conceptually, it can't run on files individually (though I would be
happy to be proven wrong on this), therefore it ends up being broken in
lint-staged when I try it. Just run it separately, even if it's a little
slower.

See vuejs/language-tools#686

Running tsc per-file might work with tsc-files, but that didn't work due
to Nuxt doing something clever that I don't have the patience to figure
out.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
question Further information is requested
Projects
None yet
Development

No branches or pull requests

8 participants