阅读 226

WebStorm提高工作效率的实用配置

前言

???? 记录WebStorm的一些实用配置

???? 持续更新中...

WebStorm打开项目忽略node_modules目录设置

当项目打开比较慢时,可以配置选择不打开node_modules目录,这样可以更快的打开项目

配置路径:  File → Settings → Editor → File Types

image-20211023145431137

WebStorm快速定位已打开页面目录的方法

如果你只知道文件名字,想到找到文件的具体位置(如果是魔鬼级的目录,有这功能简直感动哭了????)

image-20211023144620455

动效展示

q1.gif

WebStorm解决git冲突

①   路径: VCS →  Git → Resolve conflicts

image-20211023143831890

WebStorm打开设置

①   配置路径:  File → Settings  (以下的设置都是从这进去)

设置快捷键 Ctrl + Alt + S

image-20211023133843271

WebStorm自定义文档注释模板

①   配置路径:  File → Settings → Editor → Live Templates

②   找到指定位置新增配置

image-20211023141223572

如以上配置的效果

image-20211023141447423

如果想设置变量

image-20211023142148596

效果

image-20211023142600452

WebStorm配置微信wxss样式支持

①   配置路径:  File → Settings → Editor →File Types

②  找到添加的地方,输入要支持的文件后缀

微信    *.wxss
支付宝  *.acss复制代码

image-20211023133822439

WebStorm编译less并自动生成css/wxss/acss

①   配置路径:File | Settings | Tools | File Watchers | +

image-20211023134807214

②   配置在当前目录生成.css  (如果是微信就改成.wxss,支付中改为.acss)

Arguments:
--no-color $FileName$ $FileNameWithoutExtension$.wxss
# --no-color 禁用彩色的输出
# $FileName$ 当前编辑文件名
# $FileNameWithoutExtension$.css  去除.less扩展名再加上.css扩展名

Output paths to refresh:
$FileNameWithoutExtension$.wxss
# 保存在当前less目录下,并刷新项目结构显示文件出来复制代码

???? 如果想生成到指定文件夹的配置

Arguments:
--no-color $FileName$ $ProjectFileDir$/pages/$FileDirPathFromParent(less)$/$FileNameWithoutExtension$.wxss
# --no-color 禁用彩色的输出
# $FileName$ 当前编辑文件名
# $ProjectFileDir$/pages/$FileDirPathFromParent(less)$/$FileNameWithoutExtension$.css 项目目录/pages/在当前目录找到父目录less的路径/当前编辑文件名去除.less扩展名再加上.css扩展名

Output paths to refresh:
$ProjectFileDir$/pages/$FileDirPathFromParent(less)$/$FileNameWithoutExtension$.css
# 保存在指定的目录下,并刷新项目结构显示文件出来复制代码

image-20211023135133368


作者:Axjy
链接:https://juejin.cn/post/7022154302621745189

文章分类
后端
版权声明:本站是系统测试站点,无实际运营。本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 XXXXXXo@163.com 举报,一经查实,本站将立刻删除。
相关推荐