当前位置:首页 > 编程笔记 > 正文
已解决

WebStorm 在Settings → File and Code Templates中 自定义一个用于创建Vue2.0的模板。

来自网友在路上 189889提问 提问时间:2023-10-12 14:42:19阅读次数: 89

最佳答案 问答题库898位专家为你答疑解惑

WebStorm 自定义创建Vue2.0的模板。要求name为输入的文件名${NAME};<template>下的唯一元素<div> 的class为${NAME}的驼峰转中划线格式,例如:${NAME}为testVueAbc的话,class就是 test-vue-abc。
并为这个模板生成一段简短的Description。

以下是Vue2.0模板的设置步骤:

  1. 打开WebStorm,进入Settings(Windows/Linux为File → Settings,Mac为WebStorm → Preferences)。

  2. 在左侧栏中选择File and Code Templates。

  3. 在顶部的Tabs中选择Includes,然后在文件列表中找到Vue Component。

  4. 在Vue Component文件中,复制整个模板代码,并粘贴到下方的Template text框中。

  5. 修改模板代码,确保满足以下要求:

<template><div class="${NAME.replace(/([a-z])([A-Z])/g, '$1-$2').replace(/\s+/g, '-').toLowerCase()}"></div>
</template><script>export default {name: '${NAME}',    }
</script>

  • 模板的name属性为${NAME},表示文件名
  • div的class为${NAME}的驼峰转中划线格式
  1. 在Description中输入简短的模板描述,例如:Vue2.0单文件组件模板。

  2. 点击Apply,保存模板设置。

现在,每次创建Vue2.0单文件组件时,WebStorm都会使用这个自定义模板,以便快速创建Vue组件。

查看全文

99%的人还看了

猜你感兴趣

版权申明

本文"WebStorm 在Settings → File and Code Templates中 自定义一个用于创建Vue2.0的模板。":http://eshow365.cn/6-19185-0.html 内容来自互联网,请自行判断内容的正确性。如有侵权请联系我们,立即删除!