WebStorm提高工作效率的实用配置
前言
???? 记录WebStorm的一些实用配置
???? 持续更新中...
WebStorm打开项目忽略node_modules目录设置
当项目打开比较慢时,可以配置选择不打开node_modules目录,这样可以更快的打开项目
配置路径: File → Settings → Editor → File Types
WebStorm快速定位已打开页面目录的方法
如果你只知道文件名字,想到找到文件的具体位置(如果是魔鬼级的目录,有这功能简直感动哭了????)
动效展示
WebStorm解决git冲突
① 路径: VCS → Git → Resolve conflicts
WebStorm打开设置
① 配置路径: File → Settings (以下的设置都是从这进去)
设置快捷键
Ctrl + Alt + S
WebStorm自定义文档注释模板
① 配置路径: File → Settings → Editor → Live Templates
② 找到指定位置新增配置
如以上配置的效果
如果想设置变量
效果
WebStorm配置微信wxss样式支持
① 配置路径: File → Settings → Editor →File Types
② 找到添加的地方,输入要支持的文件后缀
微信 *.wxss 支付宝 *.acss复制代码
WebStorm编译less并自动生成css/wxss/acss
① 配置路径:File | Settings | Tools | File Watchers | +
② 配置在当前目录生成.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 # 保存在指定的目录下,并刷新项目结构显示文件出来复制代码
作者:Axjy
链接:https://juejin.cn/post/7022154302621745189