เพราะว่า project อย่าง Microservices หรือแม้แต่ project template ที่ใช้อยู่ตอนนี้ ผมก็มี หลาย folder เพื่อความสะดวกในการเก็บข้อมูลและเก็บ code ไว้ที่เดียวกัน จึงน่าจะทำ config เก็บไว้และยังสามารถเก็บ settings เฉพาะ project ได้อีกด้วย จะได้ง่ายในการกลับมาทำงาน
- Documents เป็นที่เก็บรายละเอียดของ project
- SourceCode เก็บ code ไว้ในนี้
- .git วางไว้ใน root folder เพราะจะเอาเอกสารขึ้น git ไปด้วย
- .gitignore บอกให้ git ไม่ต้องตามเก็บบางไฟล์
- project.code-workspace เป็นไฟล์ที่ชี้ให้ Visual Studio Code รู้ว่า folder อะไรที่ใช้บ้าง
ไฟล์ project.code-workspace จริง ๆ แล้วจะชื่ออะไรก้ได้แต่ต้องมีนามสุกล .code-workspace เนื้อหา เช่น
{
"folders": [
{ "path": "." },
{ "path": "SourceCode" }
],
"settings": {}
}
บรรทัด ที 3 – 4 มันจะบอกให้ Visual Studio Code รู้ว่า folder ที่เก็บ code / terminal จะอยู่ที่ path ไหนบ้างเวลาใช้งานก็ Visual Studio Code > File > Open Workspace from File > เลือกไฟล์ .code-workspace ที่ต้องการ ใน sidebar ซ้ายมือจะเห็น {ชื่อไฟล์} (WORKSPACE) และมี folder ที่อยู่ใน “folders” รอให้ใช้อยู่ เช่น
project.code-workspace
{
"folders": [
{
"path": "."
},
{
"path": "Documents"
},
{
"path": "SourceCode"
}
,
{
"path": "SourceCode/src"
}
],
"launch": {
"configurations": [
{
"type": "pwa-node",
"request": "launch",
"name": "Run npm start (SourceCode)",
"cwd": "${workspaceFolder}/SourceCode",
"runtimeExecutable": "npm",
"runtimeArgs": [
"run",
"start"
],
"console": "integratedTerminal"
}
]
},
"settings": {},
"tasks": {
"version": "2.0.0",
"tasks": [
{
"label": "npm: start (SourceCode)",
"type": "shell",
"command": "npm run start",
"options": {
"cwd": "${workspaceFolder}/SourceCode"
},
"problemMatcher": []
}
]
}
}
หลังจาก click ไฟล์ project.code-workspace จะเปิด VS Code ขึ้นมาพร้อม ๆ กับ npm run start ให้พร้อมทำงานเลย
อ่านเพิ่มเติม