發表文章

目前顯示的是 2019的文章

[Day0] 網頁設計師會用到的VSCODE與常用套件

圖片
[Day00] 網頁設計師會用到的VSCODE與常用套件 所謂工欲善其事必先立行器,VSCode已經是目前熱門主流的編輯器,原因除了直覺快速的介面操作,便利的專案與檔案管理,還有那些滿滿免費套件可以使用。套件不是一定需要的,每個人都有習慣的環境套件,找到符合自己的套件才是真正屬於自己的環境,以下是我推薦想成為網頁設計師的新手套件,可以分為四個類別來介紹。

視覺強化 屬於高亮提示或排版自動美化部分,方便在編輯程式碼時減少錯誤的宣告起始頭尾,也利於觀看程式碼能快速看出主體結構。
Bracket Pair Colorizer
幫你的{}大括弧上色,會自動對應不同顏色,幫助你輕鬆看準程式區段範圍。
Highlight Matching Tag
當游標停留在某一個區段或是標籤上,能高亮提示該屬於那些區段範圍或對應的頭尾標籤位置。
indent-rainbow
協助你排版(TAB)的空格填塞淡淡顏色,能幫助你對齊更快速方便。
Prettier - Code formatter
對HTML/CSS/JS支援自動化format排版效果,提升美觀性容易維護。
vscode-styled-components
幫助JS跟CSS有更高亮的視覺輔助效果
Comment Translate
滑鼠停留在變數、函數或註解能自動Google翻譯(可繁體),易用於原作者之註解說明。
filesize
增加資訊於左下角對於檔案空間為多少的輕資訊。
Image preview
可簡單輕巧提示該圖片預覽並縮圖於行數左側。
SVG Viewer
我們都知道內建支援圖片預覽但不支援svg格式,此套件可以補強此需求。
程式語言輔助 收錄MD、PHP、JQ、BS這類網頁開發的程式語言為主,使用某宣告或函式能方便提示語法說明,不必背誦太多語法也能輕鬆找到指定宣告語言。
docs-markdown
透過ALT+M或是F1輸入>docs就能快速生成MarkDown標籤,MarkDown初學者推薦。
Markdown All in One
提供一些常用的快速鍵,方便Markdown編寫上手,以及支援預覽效果。
PHP Intelephense
自動化的PHP代碼偵測,提供可用的函式或格式化整理等選項使用,僅限於PHP格式下作用。
建議關閉VSCODE內建的代碼
到擴展畫面 -> 搜尋輸入@builtin php -> 停用P…

[60秒筆記] PHP的headers already sent....

PHP出現了錯誤是 headers already sent.. 通常發生在session、setcookie、header(轉址)這些代碼時且同時無效使用。 這常發生在某PHP環境下正常(舊版本7.2),移植到新PHP環境就不允許使用(新版本7.3)。這是因為新版本更嚴謹,不允許這些PHP執行之前,你的HTML文件就已經有輸出了。你有兩個作法可改善。 調整代碼順序:
將session_start()或header()或setcookie()放在該php之頁首,確保這些函式之前沒有任何的打印輸出調整php.ini:
找到output_buffering,預設off改成on即可(apapche重啟)