vite-vuetify-ts-starter icon indicating copy to clipboard operation
vite-vuetify-ts-starter copied to clipboard

husky precommit

Open f1eeman opened this issue 2 years ago • 21 comments

vscode; actual version for this template;

I added the component to the "components" directory, then imported it into homePage.vue. Tried to commit but got the following errors: 1)Could not find "stylelint-config-prettier" 2) problems with catalog node_modules.

your styleling.config:

customSyntax: postcss-html
extends:
  - stylelint-config-html/vue
  - stylelint-config-recommended-scss
  - stylelint-config-recommended-vue/scss
  - stylelint-config-prettier
plugins:
  - stylelint-order
  - stylelint-scss
ignoreFiles:
  - 'dist/**/*'
rules:
  color-function-notation: legacy
  function-no-unknown: null
  no-descending-specificity: null
  scss/no-global-function-names: null

image

f1eeman avatar Nov 23 '22 12:11 f1eeman

What package manager are you using? Currently, it is confirmed that pnpm causes a problem.

logue avatar Nov 28 '22 01:11 logue

yarn - v3.3.0 node - v16.17.1

f1eeman avatar Nov 28 '22 12:11 f1eeman

if i use npm(8.15.0) and node v16.17.1:

  1. I need to add a pre-commit file to the husky directory with the following content:
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

npx --no-install lint-staged --relative
  1. install @babel/types in dev deps

As a result, I get the following: image

f1eeman avatar Nov 28 '22 12:11 f1eeman

Node LTS version (current is 18.12.1) or later is supported...

https://github.com/logue/vite-vuetify-ts-starter/blob/bbba232a856811ce434833fce91cf8779c57a0f3/package.json#L23

logue avatar Nov 28 '22 12:11 logue

I'm sorry, that was my mistake. However, after updating the node (now version is 18.12.1, npm version is 8.19.2), re-cloning the current repository, I ran into the same problems as when using, among other things, the yarn package

image

f1eeman avatar Nov 28 '22 14:11 f1eeman

It looks like tsconfig.json and env.d.ts are not recognized.

Restart vscode after clearing cache with yarn run clean. Also try takeover mode if possible.

logue avatar Nov 28 '22 14:11 logue

Nothing helps. The problem with the "alias" seems to me, because if all aliases (@ ) are replaced with relative paths, there are no problems with types 

f1eeman avatar Nov 28 '22 18:11 f1eeman

It seems that eslint recognizes @ normally, and it seems that vue-tsc is outputting an error, so tsconfig is suspicious. Is this in vanilla state?

logue avatar Nov 29 '22 01:11 logue

tsconfig state fully corresponds to tsconfig from this repository

f1eeman avatar Nov 29 '22 06:11 f1eeman

There may be a cause in the environment on the vscode side, such as veutr was included. Try resetting your vscode settings.

logue avatar Nov 29 '22 10:11 logue

Did not help.... I don't think it has anything to do with the ide, because firstly, this kind of errorserrors occur in any ide, and secondly, the problem is clearly with the alias in the configs(ts, eslint, vite)

f1eeman avatar Nov 30 '22 08:11 f1eeman

There was an update of Vuetify yesterday, so I updated this project accordingly. (also merged createVuetify) Did you reproduce it?

Notice: eslint-plugin-vuetify v2, which supports Vuetify3, but it is in beta.

logue avatar Nov 30 '22 08:11 logue

I have exactly the same problem, isn't there any solution yet?

dossanovruslan avatar Nov 30 '22 09:11 dossanovruslan

There was an update of Vuetify yesterday, so I updated this project accordingly. (also merged createVuetify) Did you reproduce it?

Notice: eslint-plugin-vuetify v2, which supports Vuetify3, but it is in beta.

yes, a have cloned actual version for this template, but the problem remains

f1eeman avatar Nov 30 '22 09:11 f1eeman

I don't know for a moment.

What happens if the value of lint-staged in package.json is just prettier like below?

{
 "lint-staged": {
    "*": "prettier -w -u"
  }
}

logue avatar Nov 30 '22 09:11 logue

I don't know for a moment.

What happens if the value of lint-staged in package.json is just prettier like below?

{
 "lint-staged": {
    "*": "prettier -w -u"
  }
}

The problem is with vue-tsc. If type checking via vue-ts is removed, then husky exits successfully without doubt

  "lint-staged": {
    // "*.vue": "vue-tsc --noEmit",
    "*.{js,ts,json,jsonc,json5,yaml,yml,toml,yml,yaml,vue,htm,html,md}": "eslint --fix --cache --cache-location ./node_modules/.vite/vite-plugin-eslint",
    "*.{css,sass,scss,vue,htm,html}": "stylelint --fix --cache --cache-location ./node_modules/.vite/vite-plugin-stylelint",
    "*": "prettier -w -u"
  },

f1eeman avatar Nov 30 '22 10:11 f1eeman

Thank you for your report.

logue avatar Nov 30 '22 10:11 logue

I've found a solution to the problem, but I'm not sure if it is right:

  "lint-staged": {

    !!!!!!!!!!!!!
    "*.{ts,vue}": "vue-tsc --noEmit",
    !!!!!!!!!!!!!

    "*.{js,ts,json,jsonc,json5,yaml,yml,toml,yml,yaml,vue,htm,html,md}": "eslint --fix --cache --cache-location ./node_modules/.vite/vite-plugin-eslint",
    "*.{css,sass,scss,vue,htm,html}": "stylelint --fix --cache --cache-location ./node_modules/.vite/vite-plugin-stylelint",
    "*": "prettier -w -u"
  },

AND

image

f1eeman avatar Nov 30 '22 10:11 f1eeman

In principle, it's probably irrelevant since it's based on createVue.

see also: https://github.com/vuejs/create-vue-templates/tree/main/typescript-router-pinia-vitest

logue avatar Nov 30 '22 13:11 logue

npm run type-check "type-check": "vue-tsc --noEmit -p tsconfig.vitest.json --composite false",

image

f1eeman avatar Dec 01 '22 06:12 f1eeman

This is a normal behavior because it refers to meta information such as the last build datetime that is automatically generated at build time. (This is the same reason why it says to run build-only when deploying.)

It is included in .gitignore because its nature causes file changes every time it is built.

If you really care, just comment out ./src/Meta.ts from .gitignore and include Meta.ts in your project.

logue avatar Dec 01 '22 08:12 logue