前端开发中遇到三个Bug：【VSCode无法保存代码】、【Ant Design Vue对话框背景全黑】、【This relative module was not found】

前端开发中遇到三个Bug：【VSCode无法保存代码】、【Ant Design Vue对话框背景全黑】、【This relative module was not found】

VSCode无法保存代码，文件内容较新

• 问题原因：当VSCode打开文件再编辑后没有保存时，如果该文件被通过其它方式修改保存，可能会发生冲突，就会弹出这个提示框

• 问题解决：

  打开设置

  

  找到Files:Save Conflict Resolution，将这个配置选为overwriteFileOnDisk。

  overwriteFileOnDisk的含义是当发生文件直接使用编辑器上的修改覆盖调磁盘上的源文件，冲突发生的场景一般是使用两个编译器打开，比如我使用nodepad++打开了文件，单同时我正在使用VSCode对文件进行编辑，这就导致两者发生了冲突，默认是askUser，发生冲突询问用户是否解决冲突

  

  

参考文章：VScode 无法保存，文件内容较新 | 码农家园 (codenong.com)

Ant Design Vue的对话框组件弹出后背景全黑

• 问题原因：组件使用规范问题，具体详细原因我也不得而知。

  我最开始将对话框组件写在了表单的内部，之后将对话框组件移动到表单外部即可成功解决

• 问题解决：将对话框移动到表单组件的外部

参考文章：解决Vue3使用 Ant Design，出现多个Modal，全是黑屏，导致列表页看不见问题！ - 久曲健 - 博客园 (cnblogs.com)

执行npm run serve报错This relative module was not found

• 问题：执行npm run serve报错This relative module was not found

  

  This relative module was not found:
  *./modules/CaseCarConfirmModal in ./node modules/cache-loader/dist/cjs.js??ref--12-0!./node modules/babel-loader/lib!./node modules/cache-loader/dist/cjs.js??re
  f--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader/lib??vue-loader-options!./src/views/modules/vms/CaEntranceList.vue?vue&type=script&lang=js&
  

• 问题原因：这个组件没有找到。

  CaEntranceList引用了CaseCarConfirmModal组件，但是这个组件并不存在
  PS：这个报错还是挺好解决的，错误信息中都有很明显的提示

• 问题解决：