==============================================================
相關網址
============================================================== https://code.visualstudio.com/ 下載位置 https://www.slideshare.net/shengyou/community-open-camp-php-vs-code 給 PHP 開發者的 VS Code 指南 http://www.wfun.com/news/902655.html Visual Studio Code做PHP開發 https://kknews.cc/zh-tw/tech/6envpm.html VS Code開發技巧集錦 http://vmiv.blogspot.tw/2016/09/vs-codejavascript.html 在VS Code執行JavaScript http://kanchengzxdfgcv.blogspot.tw/2017/03/php-vs-code.html 在VS Code執行PHP http://mrpeak.github.io/2015/07/02/vscode-guide/ VS Code調試Node.js
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
VS Code常用快捷鍵
ctrl+p 開啟舊檔
控制視圖窗口
* ctrl+shift+n 新建窗口
* Ctrl+Shift+w 關閉窗口
* Ctrl+N 新建文件
* ctrl+b 切換側邊欄
* ctrl+\ 拆分編輯器
* CTRL ++ 視窗縮放
* CTRL -- 視窗縮放
選取 shift + alt + mouse right 垂直選取 ctrl + shift + alt + 方向鍵. 局部方塊選取 編輯
* Alt+左右箭頭 回到前後幾次編輯的地方
* Alt+上下箭頭 上下移動選中的代碼
* Alt+Shift+上下箭頭 上下複製當前選中行
搜索
* Ctrl+P 本地文件搜索，默認列出了你打開過的文件
* Ctrl+F 當前打開的文件內搜索代碼
* Ctrl+H 當前打開的文件內搜索和替換
* Ctrl+Shift+F 在整個項目中搜索代碼出現的位置
* F12 跳轉到代碼定義處
* Alt+F12 顯示代碼定義處的縮略圖但是不跳轉過去
* shift+F12 列出所有的引用
在 Visual Studio 中的規則運算式NOT NULL\r?\n) 比對分行符號 (即歸位字元後面接著新行)。 \r? \n End\r?\nBegin 只在 "End" 是一行的最後一個字串，且 "Begin" 是下一行的第一個字串時比對 "End" 和 "Begin"。 NOT NULL\r?\n)
NOT NULL COMMENT='' \n)
Visual Studio 代碼格式化
原文網址：https://kknews.cc/zh-tw/tech/6envpm.html
Visual Studio 代碼格式化 Mac: opt+shift+f Windows / Linux: shift+alt+f ctrl+k ctrl+f 選擇範圍格式化 在Visual Studio Code內可以按下快捷鍵(SHIFT+ALT+F)對整個檔案的程式碼都進行格式化。 在一般HTML網頁，這個功能是正常的。
但是在PHP網頁(PHP語法、HTML標籤和JavaScript語法都寫在上面)，這樣按，程式碼卻沒任何反應。
能格式化的話，選了以後案右鍵會有2個Format Document選項 對 JS 有反應 對 CSS 有反應 但不能自己設置格式 安裝插件JS-CSS-HTML Formatter 後ctrl+k ctrl+f 有反應 且可以自訂格式 Press F1, enter Formatter Config, open the config file:
安裝插件php Formatter
擴充功能
===========================================================
Ctrl+P 鍵入 ext install phpcs 找到插件
PHP Debug,
PHP IntelliSense
PHP IntelliSence Cranne.
HTML Preview
按下ctrl+shift+h or cmd+shift+h 可以預覽HTML 對PHP檔無用
===============================================================
自訂檔有哪些
=============================================================== C:\Users\P7H55M\AppData\Roaming\Code - Insiders\User\settings.json #使用者自訂檔修改這個檔案
C:\Users\P7H55M\AppData\Roaming\Code - Insiders\User\locale.json #語系檔
各別目錄下
.vscode\tasks.json #運行 Ctrl+Shinft+B 來運行PHP。
.vscode\launch.json #偵錯
Ctrl + Shift + P 跳出指令輸入框
輸入 語言 -- 即可找到 "設定語言" 英文版輸入 lang
把 Locale 的值變更成希望呈現的介面語系即可
繁中: zh-TW
英文: en-US
===============================================================
設定篇 settings.json #使用者自訂檔
=============================================================== { "window.zoomLevel": 1, // 控制字型大小 (以像素為單位)。 "editor.fontSize": 18, // 控制已變更之檔案的自動儲存 "files.autoSave": "off", // 使用滑鼠滾輪並按住 Ctrl 時，縮放編輯器的字型 "editor.mouseWheelZoom": true, // 是否在儲存或輸入時執行 linter。 "php.validate.run": "onType", // 將檔案關聯設定為語言 "files.associations":{ "*.tpl": "php" }
}
心想VSCode最好能像Dreamweaver按1個 F12就能自動開瀏覽器預覽 最後研究成功寫法
什麼套件都不用安裝 只要 修改tasks.json 即可
按F1 然後鍵入 task 找到 Task: Configure Task Runner設定工作執行檔，點擊它後選"Other=>就會自動生成 tasks.js
將tasks.json裡面的內容清空，直接複製以下代碼：
{ "version": "0.1.0", "command": "explorer", "windows": { "command": "explorer.exe" }, "args": ["http://h01.test.com/${relativeFile}"] }
效果按下Ctrl+Shift+B就能打開瀏覽器了 而且位置是http://h01.test.com/+文件名
===========================================================
環境設定
http://www.wfun.com/news/902655.html 教學
設置環境變量，允許執行PHP： WIN10 打開高級系統設置（Win+R，然後輸入sysdm.cpl打開即可進入，按如下圖步驟填入 " C:\php "）
WIN7 1.Win+R，然後輸入sysdm.cpl=>點選進階=>環境變數=>path 加上 2.;D:\wamp\bin\php\php7.0.10 3.重開機才會生效
檢查PHP環境是否正常（Win+R，然後輸入CMD運行，然後執行php -h命令），如下
不裝IIS和Apache也能運行PHP網站
=========================================================== 按快捷鍵 Ctrl+Shinft+P 或 F1 然後鍵入 task 找到 Task: Configure Task Runner設定工作執行檔，點擊它後選"Other」=>就會自動生成 tasks.js 將tasks.json裡面的內容清空，直接複製以下代碼： { "version": "0.1.0", "command": "php", "isShellCommand": true, "args": [ "-S", "127.0.0.1:8080", "-t", "${workspaceRoot}"]
}
按快捷鍵 Ctrl+Shinft+B（剛才鍵入task的時候就可以看到一個Run Build Task），相當於是做了下自動編譯，然後打開瀏覽器輸入網址http://127.0.0.1:8080即可看到你的php代碼被執行了， 而且debug也開始工作了。 自己去開瀏覽器貼上網址這招蠻爛的
http://127.0.0.1:8080/ip2.php
有Apache運行環境-也能運行PHP網站
Ctrl+Shift+B就能打開瀏覽器了。
Ctrl+Shift+V來預覽該html文件
===========================================================
在Visual Studio Code中調用瀏覽器運行HTML代碼
=========================================================== 修改tasks.json { "version": "0.1.0", "command": "explorer", "windows": { "command": "explorer.exe" }, "args": ["index.html"] }
結果瀏覽器開啟後網址是:file:///D:/wamp/www/h01/index.html
{ "version": "0.1.0", "command": "Chrome", "windows": { "command": "C:/Program Files (x86)/Google/Chrome/Application/chrome.exe"}, "isShellCommand": true, "args": ["${file}"], "showOutput": "never"
}
發現瀏覽器開啟後網址是 file:///D:/wamp/www/h01/ip2.php 不是我要的自行修改
{
"version": "0.1.0",
"command": "Chrome",
"windows": {
"command": "C:/Program Files (x86)/Google/Chrome/Application/chrome.exe"},
"isShellCommand": true,
"args": ["http://h01.test.com/${file}"],
"showOutput": "never"
}
結果:瀏覽器開啟後網址是:http://h01.test.com/d:/wamp/www/h01/ip.php 也不是我要的
乾脆寫死
{ "version": "0.1.0", "command": "explorer", "windows": { "command": "explorer.exe" }, "args": ["http://h01.test.com/index.html"] }
結果OK但不滿意，這樣我每次都要改設定太麻煩
心想VSCode最好能像Dreamweaver按1個 F12就能自動開瀏覽器預覽 最後研究成功寫法
什麼套件都不用安裝 只要 修改tasks.json 即可
按F1 然後鍵入 task 找到 Task: Configure Task Runner設定工作執行檔，點擊它後選"Other=>就會自動生成 tasks.js
將tasks.json裡面的內容清空，直接複製以下代碼：
{ "version": "0.1.0", "command": "explorer", "windows": { "command": "explorer.exe" }, "args": ["http://h01.test.com/${relativeFile}"] }
效果按下Ctrl+Shift+B就能打開瀏覽器了 而且位置是http://h01.test.com/+文件名
tasks.json 變數說明
更多 task 相關設定可以參考官方文件． https://code.visualstudio.com/docs/editor/tasks
C:\Program Files\nodejs\node.exe 路徑反斜線要寫\
$ {workspaceRoot}在VS代碼中打開的文件夾的路徑 #可以得到當下 Visual Studio Code 開啟資料夾的根目錄 如 d:\wamp\www\h01 $ {workspaceRootFolderName}在VS代碼中打開的文件夾的名稱沒有任何斜杠（/） $ {file}當前打開的文件 #路徑含檔名#d:\wamp\www\h01\relativeFile $ {relativeFile}相對於當前打開的文件workspaceRoot #ip2.php 放更目錄是一樣的，如果你是放子目錄就是#HH/ip2.php $ {fileBasename}當前打開的文件的基本名稱 #ip.php $ {fileBasenameNoExtension}當前打開的文件的基本名稱，不帶擴展名 #ip $ {fileDirname}當前打開的文件的目錄名 #d:\wamp\www\h01 $ {fileExtname}當前打開的文件的擴展名 #.php $ {cwd}啟動時任務運行器當前的工作目錄
$ {lineNumber}活動文件中當前所選的行號
===========================================================
VS code 保存時自動格式化的問題
=========================================================== 用vscode寫react代碼，每當保存的時候就會自動格式化，格式化後有時候會出現語法錯誤。查了配置文件，默認的選項就是這個"editor.formatOnSave": false，應該已經是不自動格式化了。求用過的小夥伴給點建議，怎麼取消那個保存時自動格式化的效果，真的要崩潰了。 正確答案在這裡是JS-CSS-HTML Formatter在搞鬼，但又不能刪掉他，解決措施是
按F1 輸入Formatter Config 第一行加入 "onSave": false, 保存，搞定
===========================================================
VS code 怎樣讓他支援 *.tpl檔案
===========================================================
如何支持 PHP Smarty Template 語法
=========================================================== VS Code 能識別大部分主流代碼文件，當需要進行關聯語法設置時，可通過 Preferences -> Workspace Settings （或 User Settings）配置文件進行設置。
例如，以下代碼可以將後綴為 .tpl 的 Smarty 模板文件關聯成 PHP 語法：
// 將檔案關聯設定為語言
"files.associations":{
"*.tpl": "php"
}
===========================================================
VS code Git 的使用
=========================================================== 1.CTRL+SHIFT+G 2.打字區打字 0.2.1.1 按ENTER 下一行 打說明 點CHANGES 點勾 點...裡面的推送
===========================================================
快速安裝篇
=========================================================== { "window.zoomLevel": 1, // 控制字型大小 (以像素為單位)。 "editor.fontSize": 18, // 控制已變更之檔案的自動儲存 "files.autoSave": "off", // 使用滑鼠滾輪並按住 Ctrl 時，縮放編輯器的字型 "editor.mouseWheelZoom": true, // 是否在儲存或輸入時執行 linter。 "php.validate.run": "onType", // 將檔案關聯設定為語言 "files.associations":{ "*.tpl": "php" } }
===========================================================
擴充功能
=========================================================== Ctrl+P 鍵入 ext install phpcs 找到插件 PHP Debug, PHP IntelliSense 智慧型程式碼撰寫 PHP IntelliSence Cranne. 0.36 php Formatter 代碼格式化 JS-CSS-HTML Formatter 代碼格式化 Git History：显示git log和line histor