ts在vscode編輯器開發的環境搭建

2021-10-23 15:16:38 字數 2474 閱讀 8786

tsconfig.json 也可以tsc --init



,"exclude":[


"node_modules"],


"include":[


"./src/**/*.ts"


]}
注意launch和tasks的配合，已經要啟動的檔案，比如index.html

launch.json

"


// },


/bin/index.html"


,//下面這個可以預先啟動任務


//引數是tasks.json裡某個task的label值


//表示啟動之前先完成tasks裡的任務


"prelaunchtask"


:"compile"}]


}
tasks.json

,


// 	"label": "tsc: build - tsconfig.json"


// },


/.vscode"}}


,]}
package.json



,"scripts":,


"keywords":[


"123456"],


"author"


:"hzj"


,"license"


:"isc"


,"dependencies"


:}
執行安裝庫命令,會安裝package檔案裡的所有庫

npm install
gulpfile.js

這個檔案解決了ts變js,

執行報錯：reports is not defined 和extends is not defined

//引用外掛程式模組


let gulp =


require


("gulp");


let browserify =


require


("browserify");


let source =


require


("vinyl-source-stream");


let header =


require


('gulp-header');


let tsify =


require


("tsify");


var workspacedir =


"../"


;//使用browserify，轉換ts到js，並輸出到bin/js目錄


gulp.


task


("compile"


,function()


,		packagecache:})


//使用tsify外掛程式編譯ts


.plugin


(tsify)


.bundle()


//使用source把輸出檔案命名為bundle.js


.pipe


(source


('bundle.js'))


//給標頭檔案加上這些**可以實現繼承


.pipe


(header


(`var __extends = (this && this.__extends) || (function ()  instanceof array && function (d, b) ) ||


function (d, b) ;


return extendstatics(d, b);


};return function (d, b) 


d.prototype = b === null ? object.create(b) : (__.prototype = b.prototype, new __());


};})();\n`))


//把bundle.js複製到bin/js目錄


.pipe


(gulp.


dest


(workspacedir +


"/bin/js"))


;});


gulp.


task


("default"


,gulp.


series


('compile'


))
有了上面這些操作以後，自己定義一下工程結果，上面配置和js需要微動

工程開啟

code .
啟動

f5

Ubuntu安裝vscode編輯器

sudo dpkg i code 1.47.3 1595520028 amd64.deb 1.進入商店選擇外掛程式，左側狀態列，方塊形狀圖示。2.安裝外掛程式 1 c c 這個肯定是必須的。2 c c snippets，即 c c 重用 塊。3 c c advanced lint,即 c c 靜態檢...

編輯器 VSCode配置C 編譯

傳說中的編輯器有兩個，vim和emacs，乙個是編輯器之神，乙個是神的編輯器。然後又有眾多小神，是兩極多強格局。然後，軟爹說，要有我，於是vscode從天而降，帶著繼承自vs強大的智慧型，體積卻極其輕簡，同時支援外掛程式，而且流暢至極，一腳踏進了編輯器之戰。於是，感覺要變天了。用著輕量的編輯器，卻又...

vscode編輯器markdow文件匯出為pdf

1.vscode外掛程式 markdown preview enhanced 2.在vscode內開啟乙個markdown文件 3.f1調出命令列，輸入 markdown preview enhanced extend parser 4.彈出的js檔案內容替換成下面的 function format...