首页 > Web开发 > 详细

Vue(3)webstorm代码格式规范设置与vue模板配置

时间:2021-06-25 09:55:11      阅读:37      评论:0      收藏:0      [点我收藏+]

编译器代码格式规范设置

通常我们写代码时,代码缩进都是4个空格,但是在前端中,据全球投票统计,建议使用2个空格来进行代码缩进。

首先我们打开webstorm中的设置,如果使用的是mac的同学直接使用command + ,快捷方式,来到Editor-->Code Style-->HTML,将Tab sizeIndent的值改为2,同理在JavaScript中也改为2
技术分享图片
 

vue模板配置

在我们使用html练习vue时,如果我们不想每次都要创建一次vue实例对象,那么我们可以在html中配置一个模板,以后直接使用vue标签,就能直接引入代码

我们打开webstorm中的设置,来到Editor-->Live Templates,选择vue,点击右上角的+
技术分享图片
选择Live Template,然后在Abbrevition中写入vue,在Template text中写入需要配置的模板文本内容即可
技术分享图片
最后在当前页面,有个!的地方,点击Define
技术分享图片
然后勾选HTML,点击ok完成
技术分享图片
 

最后实现的效果,我们在HTML中直接输入vue,然后按tab,我们就会立马出现刚刚配置好的模板代码
技术分享图片

Vue(3)webstorm代码格式规范设置与vue模板配置

原文:https://www.cnblogs.com/jiakecong/p/14929338.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!