zoukankan      html  css  js  c++  java
  • 在vscode中创建vue的html模板

    为什么要创建模板?

    • 刚开始学习vue的时候通常是在html中写的vue。而非直接在.vue文件中写。这个时候vscode中并没有直接提供vue的模板,我们需要使用snippet直接生成模板,就像生成html模板一样。

    如何生成模板?

    1. 通过ctrl+alt+P 通过关键字Preference 找到配置用户代码块。
    2. 设置局部代码块,即选择html回车。
    3. html.json中填充你喜欢的模板即可。

    个人使用的模板

    • 类似黑马的vh模板:
    	"vh": {
    		"prefix": "vh", // 触发的关键字 输入vh按下tab键
    		"body": [
    			"<!DOCTYPE html>",
    			"<html lang="en">",
    			"",
    			"<head>",
    			"    <meta charset="UTF-8" />",
    			"    <meta name="viewport" content="width=device-width, initial-scale=1.0" />",
    			"    <meta http-equiv="X-UA-Compatible" content="ie=edge" />",
    			"    <title>Document</title>",
    			"    <script src="./lib/vue-2.4.0.js"></script>",
    			"</head>",
    			"<body>",
    			" <!-- 被vm 实例所控制的区域 -->",
    			"    <div id="app"></div>",
    			"",
    			"    <script>",
    			"		// 创建实例对象",
    			"        const vm=new Vue({",
    			"			// 指定控制的区域",
    			"           el:'#app',",
    			"           data:{},",
    			"           methods:{}",
    			"        });",
    			"    </script>",
    			"</body>",
    			"",
    			"</html>",
    		],
    		"description": "vh components"
    	}
    
  • 相关阅读:
    MongoDB 基础API使用
    MongoDB -- JAVA基本API操作
    Docker数据管理
    Docker容器的简单使用
    Docker
    Centos 7.3 镜像制作
    Fuel部署OpenStack
    Fuel
    Ceph添加、删除osd及故障硬盘更换
    ceph常用命令
  • 原文地址:https://www.cnblogs.com/SsoZhNO-1/p/12322573.html
Copyright © 2011-2022 走看看