原创 前端項目單獨部署nginx服務器

最近公司有新項目計劃做前後端分離部署,讓前端單獨部署在一臺AWS的ec2服務器,記錄一下部署的過程,免得下次又得查閱資料~ AWS ec2服務器搭建nginx前端服務器 nginx前端項目默認存放目錄:/usr/share/nginx/h

原创 優化長列表

最近做的項目有一個列表模塊數據量巨大,後端限制完數據後還有大概10000條數據,直接渲染的話會有明細的卡頓情況,於是擼起袖子開始重構。 這裏只回顧一下實現原理以便以後忘了能立馬撿起來: 1.保存原始列表數組數據; 2.只渲染可視區域大小的

原创 開源自己的react組件到npm

背景:公司讓做一些開源的事情,至於目的大家都能猜到,這裏就不多說了,無非就是增加團隊影響力(個人覺得沒有什麼用,哦哈~)。對於個人來說,如果能有機會參與到開源項目還是非常不錯的一個經歷,畢竟做自己喜歡的事情是每個人所期待的。 好了,閒話不

原创 Promise.race的用法

最近做項目讓增加一個功能,當接口請求超過5分鐘後,做個處理頁面增加錯誤提示,於是想到了Promise.race的方法,下面來記錄一下~ let P1 = new Promise( resolve => { setTimeout(

原创 解決antd中RangePicker浮層位置問題

問題描述:最近開發中遇到antd中日期選擇器浮層位置問題,之前我的項目中全局模塊已經用到了RangePicker,並且自定義了樣式,現在需要在項目的新頁籤裏使用RangePicker選擇器,然而浮層樣式又需要重新定位。 解決問題: 1.定

原创 mac上git以及nvm安裝使用

在公司用的window本,申請的mac本終於下來了,於是重新搭一下環境。因爲基本環境搭建一次就不用去管了,所以步驟也忘得差不多了,這裏再記錄一下~ # git 1.首先查看電腦是否安裝Git,終端輸入:git 2.如果沒有安裝過去官網下載

原创 記錄常用的chrome插件

谷歌網上應用商店:https://chrome.google.com/webstore/search/fireshot Chrono下載管理器:做Chrome瀏覽器中最好的下載管理器 Convertio:在線將文件從一種格式轉換爲另一種格

原创 js複雜數據結構對比問題

react項目,今天碰到一個頭疼的問題,props改變了但componentWillReceiveProps未觸發,一開始直接用瀏覽器調試沒有找到原因,之後輸出console才發現原來並不是componentWillReceiveProp

原创 js對象引用問題

let arrtest = [1,2,3]; let arrcopy = arrtest; arrcopy[2] = 1; console.log(arrtest) // [1,2,1] console.log(arrcopy

原创 js2D物理引擎插件

matter.js:http://brm.io/matter-js/   //輕量級、社區活躍、最新 box2D:http://box2d.org/    //功能全 p2.js:都推崇p2比box2D性能好點,但社區不太活躍,文檔較少

原创 webpack項目體積優化之旅

需求背景:在測試服務器上,需求覺得登錄時間過長 問題原因:於是看了一下項目包的體積,在4M左右,網速正常的情況下無關緊要,但還是有必要優化的~ 解決問題:也是重新查閱了大量的優化體積方案,項目基於react、webpack編譯打包的。 1

原创 webpack配置字體編譯問題

1.問題描述: 在做公司的項目開發的時候遇到一個問題,字體加載失敗報錯404,如下: 2.問題原因: 起初沒怎麼在意,感覺應該是項目中引用了bootstrap的cdn字體或者是font-awesome的字體,之後找了好久發現並不是引用網絡

原创 解決git文件名大小寫無法修改的問題

一、問題背景: 在當前項目中,早先創建並已經push到遠程的文件及文件夾,將名稱大小寫更改後,git無法檢測出更改。 二、原因: git默認配置爲忽略大小寫,因此無法正確檢測大小寫的更改 三、解決方法: 方案一:配置git 運行git c

原创 Babel 7 發佈

Babel 7在九月初左右的時候發佈了,刪除(並停止發佈)任何年度 preset(preset-es2015 等)。@babel/preset-env取代了對這些內容的需求,因爲它包含了所有年度所添加內容以及針對特定瀏覽器集兼容的能力。

原创 js實現數組排序

js對數組進行排序的方法還是很多的,最近剛好又有一個實現表格排序功能的需求,本來是讓後臺做的,但由於各種因素推到了前端。嗯,正好回顧一下數組排序的多種實現方式~ 1. JavaScript的sort()方法 sort()方法按照升序排列數