原创 Create-react-app 配置自定義eslint
背景 create-react-app項目構建基於react-scripts包，webpack相關配置也都在這個包裏，webpack的配置可以跟隨react-scripts包的升級而升級，非常方便。但是在實際項目中我們往往需要自
2020-06-19 16:06:00
原创 Webpack配置React支持Typescript的三種方式
背景 開門見山，我的項目是基於react的，希望在新的功能上使用Typescript，並逐步修改之前的代碼，所以我需要同時支持（TS|TSX）和（JS|JSX）。你可能不需要同時支持TS和JS，本文會同時給出兩種情況的解決要點。
2020-06-19 16:06:00
原创 windows停止端口監聽
背景 我在工作中經常遇到在windows中啓動某個服務，但是關閉服務的窗口被關閉了的情況。這個時候想要重新啓動服務就會報端口占用的錯誤。 命令關閉端口 首先查找到佔用端口的進程號PID是多少 netstat -ano | fi
2020-06-19 16:06:00
原创 Console沒那麼簡單
背景 相信對於廣大前端er來說，對console這東西並不陌生。相信大家最常用的應該就是console.log了，實際上console提供了很多方法，可以玩出很多花樣。本文將會介紹目前console提供的所有方法，希望對你有所幫助
2020-06-19 16:06:00
原创 CDN配置教程
CDN配置教程概述配置教程準備工作添加域名啓動CDN服務CNAME配置測試CDN 概述 首先聲明本教程不會講解CDN的原理，而是一份配置教程。CDN全稱內容分發網絡，通常我們使用它來進行前端優化，那麼廢話少說，接下來我將通過騰訊雲
2020-06-01 16:22:28
原创 Absolute元素相對父元素水平居中
開門見山 對子元素添加 { left: 50%; // 設置左邊距爲父元素寬度的50% transform: translateX(-50%); // 將元素向左移動該元素寬度的50%, 即使子元素的寬度大於父元素寬度，二者依
2020-06-01 16:22:28
原创 react-redux使用hooks替代connect
前言 redux的經典使用方式就是通過高階組件connect來將組件和store關聯起來，我們見過最多的場景也是connect和類組件的組合使用（也可以和函數組件配合使用）。但在擁抱hooks的今天，我們如何拋棄connect，通
2019-10-25 14:44:40
8
原创 React如何使用Echarts
前言 最近工作中需要實現數據統計面板，需要使用chart工具庫，於是嘗試了國內常見的chart工具Echarts，筆者使用的是React技術棧，這裏就展示一下React如何使用Echarts (這裏用的是Echarts3) 具體步
2019-08-02 14:31:50
原创 Web Chart工具庫
前言 最近工作中需要實現數據統計面板，需要使用chart工具庫，於是開始蒐集有關chart工具庫的情報，整理如下 工具庫 Echarts 這個庫相信大家都不陌生，國內非常常見的chart庫，基於canvas，目前常用版本是2和3
2019-08-02 14:31:50
原创 Chrome瀏覽器整個網頁截圖
具體步驟 先打開瀏覽器控制檯（F12或者Ctrl + Shift + i或者鼠標右鍵 > 審查元素） 然後快捷鍵Ctrl + Shift + p 在彈出的輸入框中輸入Capture full size screenshot，然後
2019-08-02 14:31:50
原创 Javascript中null和undefined的區別
前言 關於null和undefined的區別網上有很多不同的解釋，爲了方便自己也方便讀者所以我做了一些簡單整理 區別 開門見山，直接上主菜： null和undefined是javascript的兩種不同的基本類型, 可以通過ty
2019-07-30 14:36:30