I have updated husky and lint-staged to latest (husky 4->8, lint-stage 10->13).
Because it had stopped working for some reason.
Everything almost works but there is one thing that I wounder.
If I remeber correctly.. for example if the test suit failed on commit, the files that where staged by lint-staged where automatically unstaged on fail, but not anymore it seems.
And if I try to revert the failed file to its previos state then do a new commit the hook fails because it runs the staged file and the unstaged one.
I need to unstage the file manually then do the commit again and it works.
Is there anything I missed or is my memory out of order?
pre-commit hook
#!/bin/sh
. "$(dirname "$0")/_/husky.sh"
npx lint-staged --allow-empty
script
"lint-staged": {
"*.{js,jsx}": "npx jest --passWithNoTests --bail --findRelatedTests",
"*.{js,jsx,ts,tsx,html,css}": "npx prettier --write"
}
Related
I am trying to upgrade from husky#4.8 and lint-staged#11.2 to husky#8.0 and lint-staged##13.1 for my Nx repo. It seems that the only configuration I used to need was the following in package.json:
"scripts: {
"lint:fix": "ng lint -- --fix && npm run prettier:fix",
}
"husky": {
"hooks": {
"commit-msg": "commitlint -e $HUSKY_GIT_PARAMS"
}
},
"lint-staged": {
"*.{ts,js,css,md,html}": "npm run lint:fix",
"relative": true
}
This no longer works with the new husky and lint-staged. I followed this tutorial and installed husky: npx husky-init && npm install, installed lint-staged: npm install --save-dev lint-staged, modified the .husky/pre-commit file:
#!/bin/sh
. "$(dirname "$0")/_/husky.sh"
npx lint-staged
and added the .lintstagedrc.json file:
{
"*.ts": [
"prettier --write",
"eslint"
],
"*.html": [
"eslint",
"prettier --write"
],
"*.scss": "prettier --write"
}
When I make a new commit it seems to run. However it looks like this command either runs on every library or every staged file (I have a lot of libraries). When I change the file contents to:
{
"*.{js,ts,json,scss,md}": ["npm run lint:fix"]
}
it takes a while to run (though it seems to run and fix the linting) AND I don't get the output of my ng lint -- --fix command. If I go into the .husky/pre-commit file and change npx lint-staged to npm run lint:fix, it runs the ng lint -- --fix command, fixes what it can and prints out linting errors. However, the error doesn't prevent the commit and I have to commit any new changes that the linter fixed. With the old versions I didn't need to do this. Also I didn't need to commit a .husky/pre-commit file into my repo. (I see some workarounds that have a postinstall script that generates this file for the user).
How can I utilize lint-stage and husky newest versions to run my custom npm command so I can call ng lint like in the older versions and block commits on errors? Should I just use the older versions? Also what benefit do the newer versions provide?
I have a monorepo with several workspaces within it. It has been very common for me to use chained npm scripts for simple tasks instead of using a task runner. So for example, the following configuration (pseudo code) is very common for me and usefull as well, specially for pre and post build scripts
"scripts": {
"prebuild:task1":"task1 --task1-arguments",
"prebuild:task2":"task2 --task2-arguments",
"prebuild": "npm run prebuild:task1 && npm run prebuild:task2",
"build":"build-script --build-arguments",
}
So the above is the package.json for the child worskpace itself and then in the master package.json I have the call to the script that triggers the build for that workspace.
build:packageA: "npm run build -w packageA"
All seems working well but the chained "npm run script" inside the workspace is actually execute in the context of the master monorepo and not inside that particular workspace.
So, in summary, the first call is to run the build script in the workscape and then triggers the prebuild script of that workspace BUT as that script execute chained npm run scripts those are run in the context of the master repo which happens that they don't exist in there. So the callstack might be ...
(master) build:packageA
(packageA) prebuild
(master) npm run prebuild:task1 >>>> EXIT ERROR
The only way I found, up to now, to bypass this issue was to make my child workspace a monorepo itself holding zero woskpaces. Essentially I have a "workspaces" key in its package.json pointing to the root directory. This enables me to use the -w flag in the scripts section so to refer all scripts to itself. So my current workaround looks like this ...
"workspaces": ["."],
"scripts": {
"prebuild:task1":"task1 --task1-arguments",
"prebuild:task2":"task2 --task2-arguments",
"prebuild": "npm run prebuild:task1 -w packageA && npm run prebuild:task2 -w packageA",
"build":"build-script --build-arguments -w packageA"
}
Isn't there already a better way to solve this?
Thanks in advance to everyone!
Following this post https://stackoverflow.com/a/67060676 I found out that npm changed the way it calls nested scripts in workspaces.
I ran into similar issues like you while running npm#7.5, but the feature was introduced in npm#7.7. Updating node to v17 and npm to 8.3 resulted in everything is running as intended.
In my case I wanted to execute nested npm run build commands in workspaces.
Every time I run npm run dev(that's how my team set up that project) I get this error:
ERROR EEXIST: file already exists, mkdir 'X:......\my-project\.nuxt'
I then need to do mkdir .nuxt and try again. Usually it works, sometimes it doesn't: it keeps asking me that everytime I run npm run dev and after 5 or 10 times it works. Sometimes I won't work no matter how many times I try, so I restart my machine and then it works.
Any idea what's going on?
I have had issues of this kind when running in the past with gulp in parallel tasks that would delete and write to the same deleted directory. But, without having more information about this, and just knowing that sometimes the .nuxt directory is missing. I can't really get to the root of the problem. It might be something related with the nuxt.config.js
This is the only solution that I see for now.
Even though this might not fix the original issue what you could do to at least be able to develop without having to worry any longer is:
Add the rimraf package and run it always before running the dev command.
Add the mkdirp package and run it after the deletion of the folder happen
If you add the commands globally now you should have in your terminal both commands available and you can run
rimraf ./.nuxt && mkdirp .nuxt && npm run dev
This would be the least intrusive approach as it wouldn't affect any of your team members.
If also they are affected by this you can also add this packages as a devDependency and add another npm run dev command as shown here.
{
...
"scripts": {
"dev": "rimraf ./.nuxt && mkdirp .nuxt && npm run dev"
}
...
}
I use vue.js + vue-cli + webpack to build my applications. During development I will run npm run dev to have webpack continuously watch my sources, compile everything, and reload the browser. To create production build, I can simply run npm run build. I would like to do this in a way that when I make a git commit, if my sources have changed, the build is created automatically.
My current approach is to simply use git pre and post commit hooks to automatically run npm run build and add the built files to the commit. This has the following downsides:
Even if other parts of the repo are changed, I re-run the build process for the Vue app, and it takes a very long time.
It makes resolving merge conflicts nearly impossible.
It creates a lot of cruft in the repo, ballooning its size
Typically I use a Vue.js frontend with a Django backend in the same repo, and deploy to Heroku or similar via a git push. What other methods are out there for accomplishing this task that don't have the above downsides?
Write a script in the package.json scripts section with something like
build && git commit -m "Build commit"
I have created a Scala, Play project. I am trying to add Angular2 in it. I added two npm commands through edit configuration. They are suppose to install the required packages and use webpack to bundle final JS. I notice that nothing happens after 2nd script is executed (I do not know if that script is hung or there is some other issue (see pic). It seems that the 2nd npm script is stuck because on stopping the run command, I see exit code 1 - Process finished with exit code 1
Is there a way to find out if Intelli build/run process is still running?
The issue was with the 2nd script (npm start). I had to remove --profile --watch flag from the webpack command. This works - "scripts": {
"start": "webpack --config webpack.config.dev.js --progress"
}