想把代码块移到另一个文件?vscode 一键移动!

2023 年 9 月,vscode 支持了

一键把一段代码从一个文件移到另一个文件,且同步更新所有引用和 import

话不多说,大家看官网的 GIF,问题我会在后面指出

操作流程

第一步,点击变量,看到灯泡

第二步, 点击灯泡,选择 Move to file

第三步,选择一个文件,比如 hero.model.ts

第四步,查看 git 变化,路径会自动更改,代码也会移到目标文件

第五步,解决问题

  • 查看目标文件里之前是不是 import 过要移动的代码,这里就是 HeroBase,如果有,把 import 删掉。 这应该是个 bug,不过幸好影响范围不那么大,一次操作只有一个文件可能有问题。
  • import 不会自动去重,比如

如果把 bar 移到 b.ts 里,会出现 x 的重复 import

  • 另一个似乎不影响的小问题,要移动的代码下面的注释也没了,移过去的地方也没有。不过如果注释下面还有代码,这个注释就不会动。

实话说,有了这个功能,移动代码,会省事很多,但目前使用还是建议测试下再提交代码!

其他的重构技巧

选中变量名或文件名, F2 重命名,也会自动同步修改所有引用!

如果想先预览下,Shift+Enter

当然,这个是不是真的能替换所有引用,跟你的项目和框架也有些关系。 像 Angular template 上的变量,经常就无法自动更新。

重构里面的其他选项

选中一段代码,右击,点击 重构或 Refactor

你就能看到一堆重构技巧!

尽情享受!

发布原文

相关推荐
wuhen_n1 分钟前
破冰——建立我们的AI开发实验环境
前端·javascript
HelloReader5 分钟前
Flutter 自适应布局一套代码适配手机和平板(十二)
前端
牛奶8 分钟前
HTTP裸奔,HTTPS穿盔甲——它们有什么区别?
前端·http·https
梓言10 分钟前
tailwindcss构建执行npm exec tailwindcss init -p 报错
前端
哈罗哈皮11 分钟前
龙虾(openclaw)本地快速安装及使用教程
前端·aigc·ai编程
用户231154445305812 分钟前
React中实现“双向绑定”效果的几种方式
前端
HelloReader12 分钟前
Flutter Sliver 高级滚动打造 iOS 通讯录体验(十三)
前端
a11177644 分钟前
程序化几何背景生成器(html 开源)
前端·开源·html
浮笙若有梦1 小时前
我开源了一个比 Ant Design Table 更好用的高性能虚拟表格
前端·vue.js
一只程序熊1 小时前
vite-cool-unix-ctx] Unexpected token l in JSON at position 0
java·服务器·前端