您的位置：極速下載站→ 資訊首頁 → 軟件教程 → 電腦軟件教程 → vscode中Tasks及Emmet的應(yīng)用教程

vscode中Tasks及Emmet的應(yīng)用教程

時間：2019-08-17 15:09:24 作者：無名瀏覽量：21

vscode中Tasks及Emmet的應(yīng)用教程

Visual Studio Code 1.31.0 官方版
大�。�38.6 MB
日期：2019/8/17 15:23:08
環(huán)境：WinXP, Win7, Win8, Win10, WinAll

大家好，隨著人們對生活的質(zhì)量要求越來越高，電腦已經(jīng)成為人們生活和工作中的必需品，電腦是有很多軟件系統(tǒng)程序組成，如果想要學(xué)好電腦，我們必須對這些軟件系統(tǒng)程序有所了解，今天小編就帶領(lǐng)大家學(xué)習(xí)vscode中Tasks及Emmet的應(yīng)用.歐洲五大聯(lián)賽即將開始啦！

圖：vscode中Tasks及Emmet的注意事項

vscode中Tasks及Emmet的應(yīng)用教程圖1

接上一篇，今天再來介紹2個vscode的使用技巧，一個是tasks，相當(dāng)于腳本命令，一個是Emmet，emmet其實前面在我介紹sublime的時候?qū)戇^。這篇文章是基于vscode，寫下如何配置自定義代碼片段。歐洲五大聯(lián)賽即將開始啦！

vscode的Tasks的應(yīng)用

為什么要用tasks?

圖：vscode中Tasks及Emmet的注意事項

vscode中Tasks及Emmet的應(yīng)用教程圖2

當(dāng)我們需要運行命令的時候，需要調(diào)出命令行工具，然后再執(zhí)行某個命令操作。但是有了tasks之后，我們可以直接在編輯器中運行。歐洲五大聯(lián)賽即將開始啦！

類似如下代碼：

[JavaScript]純文本查看復(fù)制代碼

"scripts": {

"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js"，

"start": "npm run dev"，

"unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run"，

"e2e": "node test/e2e/runner.js"，

"test": "npm run unit && npm run e2e"，

"build": "node build/build.js"

}，

啟用tasks任務(wù)步驟如下：

[JavaScript]純文本查看復(fù)制代碼歐洲五大聯(lián)賽即將開始啦！

1、mac下面輸入 cmd p ，window下面輸入 ctrl p

2、輸入 task（task 后有空格）

3、選擇命令運行npm:dev

4、選擇繼續(xù)而不掃描任務(wù)輸出等

如果你需要訂制自己的task，可以參考文檔。不過，自己定義的task只是在本項目中使用。對于前端開發(fā)者來說，經(jīng)常使用的命令可以添加到package.json中。所以這里我們只是把Tasks當(dāng)作快速啟動命令的工具。

圖：vscode中Tasks及Emmet的注意事項

vscode中Tasks及Emmet的應(yīng)用教程圖3

vscode中使用Emmet歐洲五大聯(lián)賽即將開始啦！

關(guān)于Emmet，我們已經(jīng)很熟悉了，vscode中內(nèi)置的，這里就不多闡述了，emmet更多用法可以看：https://docs.emmet.io/cheat-sheet/

下面說一下如何快速生成vue模板頁配置，步驟如下：

打開vsocde的首選項>用戶代碼片段，輸入vue，選擇代碼片段文件為vue.json。輸入以下內(nèi)容。

[JavaScript]純文本查看復(fù)制代碼

"Vue component": {

"prefix": "vuec"，

"body": [

"<template>"，

"t$1"，

"</template>"，

"<script>"，

"export default {"，

"t"，

"}"，

"</script>"，

"<style rel="stylesheet/scss" lang="scss" scoped>"，

"</style>"，

]

}

Visual Studio Code 1.31.0 官方版

軟件性質(zhì)：國產(chǎn)軟件
授權(quán)方式：免費版
軟件語言：簡體中文
軟件大小：39531 KB
下載次數(shù)：636 次
更新時間：2019/8/17 15:08:15
運行平臺：WinAll...
軟件描述：Visual Studio Code是一個輕量但功能強(qiáng)大的源代碼編輯器，可在桌面... [立即下載]

vscode中Tasks及Emmet的應(yīng)用教程

Visual Studio Code 1.31.0 官方版

相關(guān)資訊

更多常用電腦軟件