2019年12月28日

[Vue] 整合 Vue style guide, eslint-plugin-vue 和 VSCode

在 Vue Style Guide 中對於 Vue 專案的程式風格提供了許多建議,但有些時候在撰寫程式時還需要額外留意這些撰寫風格反而變成一種負擔,好在這時候 Vue 提供了好用的 eslint-plugin-vue (@vue/cli-plugin-eslint),透過 eslint 可以幫我們檢查哪些程式碼中的內容是不符合 Style Guide 所建議的,並且予以修正。 同時搭配上 VSCode 後,可以在存檔後自動根據 eslint 的建議來重新編排程式碼,不只省下了許多需要調整撰寫風格的認知負擔,更重要的是省下了許多時間,可以專注在程式開發上。 在這篇文章中就說明如何根據...

2019年12月6日

[WebAPIs] Picture In Picture of Video

keywords: video, WebAPIs TL;DR 新技術一定有風險,瀏覽器有支援有不支援(目前只有 Chrome 預設是支援的),使用前應詳閱公開說明書! // 檢驗瀏覽器有無支援 Picture In Picture API if ('pictureInPictureEnabled' in document) { // 有支援... } // 進入 video 的 PIP 模式 videoElement.requestPictureInPicture().catch((error) => { // 錯誤處理... }); // 離開 video 的 PIP...