在开发的过程中,我们一个项目中会有很多的文件,每个文件中也会有很多的层级关系,有时候新建一个文件的时候,一不下心就会出错,位置出错我们可以移动更换位置,名称命名错误,我们可以重命名,在这里教大家使用webstorm的时候如何重命名文件?
1、首先打开我们的项目,这里我为了演示如何重命名,新建了一个小项目,如下图所示:
![e059d9ba8cd5aebb26e5f6e1b39112ba.png](https://img-blog.csdnimg.cn/img_convert/e059d9ba8cd5aebb26e5f6e1b39112ba.png)
2、我们双击左侧导航的index.html,打开该文章,然后鼠标点击左侧的index.html,呈现选中状态,如下图所示:
![3175ac71567690bf051e19fad2d6a71f.png](https://img-blog.csdnimg.cn/img_convert/3175ac71567690bf051e19fad2d6a71f.png)
3、然后我们找到工具栏,正数第六个,Refactor,点击Refactor下的Rename,如下图所示:
![c230b5274c0eec26e6c39d9fe6300b20.png](https://img-blog.csdnimg.cn/img_convert/c230b5274c0eec26e6c39d9fe6300b20.png)
4、直接在输入框内填写正确的文件名称即可,我这里修改为book.html,下面两个单选框的意思是所有引用到这个文件的地方都要更改,或注释中也都要更改,如下图所示:
![0d02279235ffd224cdac39b8db145f20.png](https://img-blog.csdnimg.cn/img_convert/0d02279235ffd224cdac39b8db145f20.png)
5、然后我们点击Refactor重构即可,等待重构完成,页面上已经显示更改过来了,如下图所示:
![8ca1a8f9b8616aa6a501211eca5ece65.png](https://img-blog.csdnimg.cn/img_convert/8ca1a8f9b8616aa6a501211eca5ece65.png)
6、还有一个也是特别简便的方法,我们直接在想要更改的文件上右击,如下图所示:
![f90bc1f029513fbaee7f15d77561cf44.png](https://img-blog.csdnimg.cn/img_convert/f90bc1f029513fbaee7f15d77561cf44.png)
7、同样我们选择Refactor 下的Rename,然后再把名字更改成index.html,然后确定,如下图所示:
![007e26f4d33c7a1015f57717d1145710.png](https://img-blog.csdnimg.cn/img_convert/007e26f4d33c7a1015f57717d1145710.png)
8、我们再回到页面中来看,如下图所示的那样,名称已经更改过来:
![2ba84f4c4b2e2a472111a165a62f3715.png](https://img-blog.csdnimg.cn/img_convert/2ba84f4c4b2e2a472111a165a62f3715.png)
9、本文提到的两种方法大家自己选择,个人习惯是直接在页面中右键更改,当然了适合自己的才是最好的。