前端开发：VS Code编辑器新建Vue文件自定义模板的方法 | 掘金6月更文挑战

这是我参与更文挑战的第2天，活动详情查看： 更文挑战

在前端开发过程中，尤其是对于经验不足的初级开发者来说，需要掌握一些必备的提升开发速度的技巧，比如使用各种插件来提升开发速度，这样才能事半功倍。VS Code编辑器每次新建一个Vue文件的时候，都要重新输入一次template、script、style，是不是觉得很麻烦，而且也浪费了效率，这就需要插件来帮忙。

本篇博文来分享一个开发常用的技巧，资深开发者不屑于知道的技巧，但是对于不知道的开发者来说还是非常重要的一个技巧，不卖关子了，接下来分享一个关于VS Code编辑器进行前端开发的时候，新建空白的Vue文件之后，在里面创建自定义模板的方法，这样可以节省开发效率，也可以省去不必要的复制粘贴操作。

尤其是在Vue开发过程中，不断新建.Vue文件是少不了的操作，但是每次新建的.Vue文件都是没有任何代码的空文件，开发者不可能每次都要在新建的空文件里面一点一点写文件结构吧，这就用到VS Code编辑器的自带插件，该插件可以在新建的.Vue文件里面通过一步就可以创建生成一套模板，根据需要选择模板类型。

具体操作如下所示：

首先打开项目新建的空.Vue文件；

然后鼠标点进文件中，输入:vue ，然后选择模板类型之后，直接回车，即可自动生成页面结构模板。

上面操作仅需一步，就可以完美实现空.Vue文件的自定义模板创建。

实例模板如下所示：

        <template>
  
	</template>

	<script>
	export default {

	}
	</script>

	<style>

	</style>
复制代码

以上就是本章全部内容，欢迎关注三掌柜的微信公众号“程序猿by三掌柜”，三掌柜的新浪微博“三掌柜666”，欢迎关注！