关闭→
当前位置:趣知常识网>游戏数码>IT技术>Webstorm强大的定位功能,使用详解

Webstorm强大的定位功能,使用详解

趣知常识网 人气:2.62W

Webstorm前端开发工具,内置有强大的文件定位功能,下面来看下具体怎么使用。

操作方法

(01)打开Webstorm,并打开一个项目,在一个html文件里,我们可以看到有引入了一些js文件。

Webstorm强大的定位功能,使用详解

(02)按住键盘上的command键(windows上,应该是ctrl键),然后鼠标移到这个脚本文件上时,就会出现一个下划线,点击鼠标左键。

Webstorm强大的定位功能,使用详解 第2张

(03)点击后,在编辑器上就会打开这个脚本文件了,十分方便,在项目文件多时,不再需要逐层查找文件所在的地方了。(引入的css文件,同样支持这样打开)

Webstorm强大的定位功能,使用详解 第3张

(04)在html文件上的js代码里,通过点击调用的方法,我们也可以定位到其所在的文件。同样是按住键盘上的command键,然后点击这个add_some()方法。

Webstorm强大的定位功能,使用详解 第4张

(05)点击后,同样会打开定义该方法的文件,还会具体定位到该方法所定义的行里,如图,该方法加上了浅浅的背景色。

Webstorm强大的定位功能,使用详解 第5张

(06)除了脚本文件能定位得到,我们的样式文件也同样能定义,如图,在一个元素的class里,我们同样是按住键盘上的command键,鼠标移动上去后,就可以看到样式名会变颜色,还有提示该样式所在的文件。

Webstorm强大的定位功能,使用详解 第6张

(07)鼠标点击左键,则会打开该样式文件,并者定位到具体的样式定义上。

Webstorm强大的定位功能,使用详解 第7张
TAG标签:#WebStorm #