项目场景:
最近做的项目是一个使用UmiJS搭建的React的前端老项目,项目是上一个开发团队遗留下来的老项目,我们接着在原来的基础上开发。团队成员中有的是Windows电脑,有的是Mac电脑,所以存在规范不统一的情况。
问题描述
在MacOS系统上,项目中有的文件的热更新无效,有的却可以,有点奇怪。而Windows系统上却全都可以热更新。之前一直以为是项目框架的问题,而实际上不是。是项目中Git仓库里存在两个同名但大小写不一样的两个文件夹。
原因分析:
最后用排除法确定到是文件夹大小写问题导致的,因为linux系统和Unix系统都是严格区分大小写,而Windows系统不区分大小写。
例如:在xxx.jsx文件中引入以下文件Level.jsx文件,
import Level from '@/pages/test/component/Level' import Level from '@/pages/Test/component/Level'
这两个路径在Windows系统中项目的热更新都是会生效的,而如果在linux或者Unix系列的MacOS上就严格区分了,热更新就无效了。其实根本的原因是存在了两个文件夹。去查看Git的仓库确实发现两个一样的文件夹,只是有的大写,有的小写。并且在代码中引入时没有不管大小写问题,导致WebPack找不到文件,无法进行监听。webpack的热更新原理图如下:
解决方案:
合并文件夹,严格区分大小写,文件中引入时也是严格按照实际的文件名引入。
在idea中重命名文件夹,比如:test重命名成Tests,然后提交代码,Git会把test的删除,新增Tests的文件夹,这时仓库中就只有一个了,之前的两个文件夹test、Test都会被删除,然后在把Tests的这个文件夹名称重命名成Test的,代码中的引用也全都改成严格大小写的。webpack的热更新就生效了。
简单备份下你将要重命名的文件,然后先删除,提交,再将刚才的备份文件复制进来,修改文件名即可。这样 git 就会认为你先删除了一个文件,然后再添加了一个新文件。
扩展知识:
由于Windows文件系统不区分大小写,所以你不能通过大小写来区分文件名或文件夹名,比如你在资源管理器中新建一个A.txt文件,想再建个a.txt时会提示你重名并自动重命名。这在Git操作时可能会遇到问题,比如你代码库里文件或文件夹修改了名称,默认Git认为是没变的,如果单纯让Git在仓库中区分大小写会产生两份文件并且无法在Windows系统中观察到),如果要解决这个问题一般需要两次提交:
先改名或删除提交,然后再修改提交。
先提交删除,再提交添加
简单备份下你将要重命名的文件,然后先删除,提交,再将刚才的备份文件复制进来,修改文件名即可。这样 git 就会认为你先删除了一个文件,然后再添加了一个新文件。
据说
Windows
是为了兼容Dos
,才没有区分大小写,后续就一直不区分了。
Linux
则是一直区分大小写的。Mac
则可以在制作分区时选择此分区是否要区分大小写。
Win10
引入了WSL
,如上所述Linux
是需要区分大小写的,为此微软给NTFS
文件系统加了个SetCaseSensitiveInfo
标志,可以支持在文件夹级别启用或禁用。启用之后,
Windows
程序也可以对这个文件夹下的文件区分大小写了。
参考文献:
0、Windows 不区分大小写 - 走看看
1、解决 git 对重命名文件名大小写不敏感的问题_曾经去过跨越一个小时的地方的博客-CSDN博客