집 >개발 도구 >VSCode >vscode를 사용하여 html5를 작성하는 방법

vscode를 사용하여 html5를 작성하는 방법

藏色散人원래의: 2020-03-17 09:23:047011검색

vscode를 사용하여 html5를 작성하는 방법은 무엇입니까?

맞춤형 html5 템플릿

새 html 템플릿을 만들 때마다 항상 너무 단조롭게 느껴집니다. 예를 들어, 새 템플릿을 만들 때마다 Vue가 자동으로 도입되고 빈 페이지 템플릿이 표시되기를 바랍니다.

권장 학습: vscode tutorial

(1) html.json 파일 찾기: 설정을 클릭하고 사용자 코드 조각을 찾습니다.

vscode를 사용하여 html5를 작성하는 방법

html.json 파일이 나타나면 클릭하세요

vscode를 사용하여 html5를 작성하는 방법

(2) html.json 파일을 연 후 H5 템플릿을 맞춤 설정할 수 있습니다

vscode를 사용하여 html5를 작성하는 방법

html.json 파일 구성을 첨부하고 직접 입력하세요 원래 중괄호:

"h5 template": {
        "prefix": "vh", // 对应的是使用这个模板的快捷键
        "body": [
         "<!DOCTYPE html>",
         "<html lang=\"en\">",
         "<head>",
         "\t<meta charset=\"UTF-8\">",
         "\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">",
         "\t<meta http-equiv=\"X-UA-Compatible\" content=\"ie=edge\">",
         "\t<title>Document</title>",
         "\t<script src=\"./lib/vue-2.4.0.js\"></script>",     
         "</head>\n",
         "<body>",
         "\t<div id =\"app\"> </div>\n",
         "\t<script>",
         "\t //创建Vue实例,得到 ViewModel",
         "\t var vm = new Vue({",
         "\t\tel: &#39;#app&#39;,",
         "\t\tdata: {},",
         "\t\tmethods: {}",
         "\t });",
         "\t</script>",
         "</body>\n",
         "</html>"
        ],
        "description": "HT-H5" // 模板的描述
     }

전송 의미 문자 설명:

t " n은 모두 이스케이프 문자이고 공백은 단순 공백입니다. 입력 시 공백을 입력할 수 있습니다.

t는 다음 탭 위치와 동일하게 가로로 점프하는 것을 의미합니다. 탭 키

" 큰따옴표

n인데 캐리지 리턴과 줄 바꿈을 의미합니다

위 내용은 vscode를 사용하여 html5를 작성하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

json html5 html vscode

성명：

이전 기사：vscode로 nodejs를 작성하는 방법다음 기사：vscode로 nodejs를 작성하는 방법