一、基本情况：
硬件环境：MacOS 10.14.6
背景：
1，用vue3官方npm init vue@latest初始化创建的vue3 + ts4.8项目，IDE是 VS Cde 1.77.3版本
2，初始化项目之后给项目配置了.editorconfig，方便团队统一格式。
3，配置了husky，在git commit的时候做两个检查：
1），检查commit的消息是否符合规范
2），检查项目内容是否满足eslint要求
二、问题和解决方案：
问题1：git commit的时候提示：env: sh\r: No such file or directory
原因：
1，（修改）重新保存.husky/commit-msg之后，文件的编码变为了dos的，因为我的电脑是mac需要修改为unix的。
2，为什么保存之后会变为dos编码格式？是因为我的工程配置了.editorconfig，其中的一个配置项end_of_line = crlf导致保存的时候自动存成了dos编码格式的。
解决方案：
方案1， 修改文件编码，将.husky/commit-msg文件编码手工改为unix的，步骤参考：sh提示“no such file or directory”解决办法-百度经验
方案2，也可以用vs code 可视化的转换，点击IDE底部的CRLF或者LF弹出编码选项框选择
方案3，注释掉.editorconfig配置中的end_of_line = crlf
出问题的时候我的.editorconfig配置内容为：
# 表明是最顶层的配置文件
root = true
# 正则*匹配所有文件
[*]
# 编码格式
charset = utf-8
# 定义换行符，我查看了一下我们的代码中换行基本都是\r\n，因此使用crlf ，而不使用lf
end_of_line = crlf
# 缩进空格数
indent_size = 2
# 缩进方式
indent_style = space
# 文件是否以空白行结尾
insert_final_newline = true
# 是否去处行首行尾的空白字符
trim_trailing_whitespace = true
# 正则匹配以.md结尾的文件
[*.md]
# 保存文件时是否在结尾添加一个新行
insert_final_newline = false
# 在新行之前是否移除所有的空格字符
trim_trailing_whitespace = false
再三折腾之后，明确了是配置中的换行符定义导致的，再三思考，将其去掉吧。
于是.editorconfig变为如下，也就解决了问题：
# 表明是最顶层的配置文件
root = true
# 正则*匹配所有文件
[*]
# 编码格式
charset = utf-8
# 定义换行符，我查看了一下我们的代码中换行基本都是\r\n，因此使用crlf ，而不使用lf
# 可能会导致命令脚本在mac下保存后变为dos编码格式而无法执行，因此这一条规则注释掉
# end_of_line = crlf
# 缩进空格数
indent_size = 2
# 缩进方式
indent_style = space
# 文件是否以空白行结尾
insert_final_newline = true
# 是否去处行首行尾的空白字符
trim_trailing_whitespace = true
# 正则匹配以.md结尾的文件
[*.md]
# 保存文件时是否在结尾添加一个新行
insert_final_newline = false
# 在新行之前是否移除所有的空格字符
trim_trailing_whitespace = false
四、我的踩坑和排查经历，可看可不看。
我的husky配置步骤：
1，安装husky依赖
npm install husky --dev2，在package.json中配置整个项目的初始化scripts（方便团队伙伴 npm install的时候自动install husky）：
"scripts": {
"prepare": "npx husky install"
}3，手动执行husky install，或者整体项目执行npm install，因为我已经安装过整体项目，就单独install husky
npx husky install4，添加 commit-msg hook
npx husky add .husky/commit-msg "npx eslint --fix src/**/**.{ts,vue}"这一个步骤会在.husky文件夹下添加一个文件名为commit-msg的命令执行文件。
里面的内容为：
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"
npx eslint --fix src/**/**.{ts,vue}
至此测试，git commit，一切还正常。
幺蛾子即将出现
5，我计划给commit-msg hook再配置一个消息的校验
于是用vs code 打开.husky/commit-msg，在里面增加一行 node scripts/verifyCommit.js 保存，里面的内容变为：
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"
node scripts/verifyCommit.js
npx eslint --fix src/**/**.{ts,vue}
同时在scripts文件夹下，增加verifyCommit.js，内容是网上通用的：
const fs = require('fs')
const msg = fs.readFileSync('.git/COMMIT_EDITMSG', 'utf-8').trim()
const commitRe = /^(revert: )?(feat|fix|docs|dx|style|refactor|perf|test|workflow|build|ci|chore|types|wip|release)(\(.+\))?: .{1,50}/
const mergeRe = /^(Merge pull request|Merge branch)/
console.log('开始检测提交信息是否合规, msg = ', msg)
if(!commitRe.test(msg)) {
if(!mergeRe.test(msg)) {
console.log('git commit 信息格式校验【不】通过')
console.error(`git commit 信息格式不对，需要使用 title(scope): desc的格式
比如 fix: xxbug
feat(test): add new
具体校验逻辑请看 script/verifyCommit.js
`)
process.exit(1)
}
} else {
console.log('git commit 信息格式校验通过')
}
再次测试，到此问题出现：
env: sh\r: No such file or directory
删掉刚才添加的node scripts/verifyCommit.js行，保存，再测试，也不行。。。。
上百度，上google，我擦，跟我这现象的不太多啊，不是一个通用问题。就这么简单的一个操作，咋会出问题。各种折腾开始。。。
删掉整个.husky文件夹，重新install,
npx husky install重新用命令添加hook：
npx husky add .husky/commit-msg "npx eslint --fix src/**/**.{ts,vue}"再测试，好了。
在网上看到过一篇文章说是钩子文件的编码格式问题，开始尝试
再打开.husky/commit-msg，什么都不做，直接保存一下。再测试，挂了。。至此，那肯定是.husky/commit-msg文件的编码格式问题了。
vim .husky/commit-msg
然后输入 :set ff 查看文件格式，果然，此时变成了fileformat=dos，郁闷。
再次输入 :set fileformat=unix 然后输入:wq保存退出，测试，好了。。
上面块中的步骤，其实可以用vs code显示的处理哈。
继续排查为什么保存commit-msg命令文件之后，就会有问题，直接猜测是配置文件.editorconfig导致的，于是改个名字试试看，把.editorconfig改为.888editorconfig，再次保存commit-msg文件，没问题了。
里面的哪个配置导致的呢，直接就怀疑是end_of_line = crlf，注释掉试试看。文章来源：https://www.toymoban.com/news/detail-421931.html
果然是，真没想到这个配置会导致unix编码的文件变为dos格式。也没其他的影响，那就过段去掉吧。。。文章来源地址https://www.toymoban.com/news/detail-421931.html
到了这里，关于Vue3 + TS4.8踩坑之配置husky问题env: sh\r: No such file or directory的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
