原创 vue-cli3.0設置靜態文件簡寫路徑
經常在項目中層次比較深的vue文件需要引用一張靜態圖片的時候會有很多的../../../這樣看起來很不舒服，vue的腳手架正好有這相關的配置。 const path = require('path') module.exports =
2020-06-21 23:45:33
原创 js獲取電腦上的音視頻設備
最近公司派我去完成一個有關推流翻譯音頻的桌面應用，近期的博客會圍繞着這方面展開，包括使用到的相關技術以及相關的學習到的新東西。 首先是通過js來獲取電腦上的音視頻設備，這邊我做了處理只拿了音頻相關的設備 navigator
2020-06-21 23:45:33
原创 fluent-ffmpeg在electron框架中實現推流
需要準備這幾個東西 electron框架 ffmpeg.exe應用程序 鏈接：https://pan.baidu.com/s/1TyzYlWG0p7cxpqrzziVRCA 提取碼：ofd2（也可自行去官網下載） fluent-ffmp
2020-06-21 23:45:32
1
原创 react路由組件按需引入
對於大型的react項目的首頁加載速度如果沒有對路由組件進行按需加載打開速度是很慢的。 新建jsx文件 import React from 'react'; export default function (componentFacto
2020-06-21 23:45:22
原创 nginx配置文件的gzip壓縮
借鑑了https://blog.csdn.net/kwy15732621629/article/details/78475021 先把效果圖上來吧 優化後 優化前 對比之後可以明顯的發現配置了gzip後瀏覽器請求的文件大小小了很多。
2020-06-21 23:45:22
原创 脫離腳手架0-1搭建react項目
公司的項目太多了有小半年沒有寫博客了。今天準備更新這篇乾貨。背景：這段時間經歷了公司，項目的洗禮讓我對於項目的自主搭建有了更深刻的認識。當我們使用別人的東西開始就註定要受制於人，例如create-react-app這樣的腳手架一切的東西都
2020-06-04 04:14:42
原创 一個關於react hook計時器的問題
在react hook中使用定時器的時候遇到了一個這樣的問題 這樣使用計時器的話會出現一個結果，n永遠是2，因爲定時器中的上下文指向的一直是定義n初始值爲1的時刻。 const [n, setN] = useState(1) <but
2020-02-24 19:32:19
原创 create-react-app腳手架webpack的配置
當我們create-react-app安裝好了一個react的項目的時我們會找不到相關的webpack配置的文件。 這裏我們不能像vue-cil3.0一樣直接根目錄新建vue.config.js。 打開package.json可以看到sc
2020-02-22 16:18:57
原创 react的context使用方法
先看一下目錄，很多博客上都是直接將父子組件全部寫到同一個文件上，但是在項目中大部分需要將組件抽離成各個文件。 context.js import React from 'react' const MyContext = React.
2020-02-22 16:18:57
原创 next.js配置css和scss共用
在next框架中如果你引用了第三方的ui庫那麼你肯定要引入相應的ui庫樣式，這樣樣式基本都是編譯後的css文件。然而我們日常開發中的樣式要麼是scss，less之類的css預處理器。 在next框架中如果不進行相應的配置是不能同時使用cs
2020-02-22 16:18:57
原创 next.js開發seo服務端渲染方案
好久沒有更新博客了，最近公司官網重構技術選型方面選擇了react爲基礎的next框架。 框架的原理大致就是在前端和後臺數據之間加了一層node.js服務這樣，瀏覽器請求頁面數據的時候可以直接請求到經過node層處過後的帶有數據的html，
2020-02-22 16:18:57
原创 react在hook中使用mobx
和class組件的寫法不同，hook使用mobx需要在組件的最外層包裹一層mobx-react提供的observer，在沒有包裹observer的情況下可以拿到mobx的數據也可以改變mobx的數據，但是改變之後不會觸發視圖的更新。 i
2020-02-22 16:18:57
原创 next在style標籤上使用scss語法
在開發項目的過程中碰到了這樣的一個問題：頁面的已經在瀏覽器中打開了但是樣式卻沒有。 分析了一下原因可能是因爲我引用頁面樣式是直接import外部scss文件，然後服務端渲染的過程中沒有將樣式文件渲染進去，因此想到的解決辦法就是直接在頁面的
2020-02-22 16:18:57
原创 react的靜態組件
react的項目開發中有使用一些UI框架框架中有一些組件是這樣寫的：這是react-bootstrap輪播圖組件。 <Carousel activeIndex={index} onSelect={handleSelect}>
2020-02-22 16:18:57
原创 react插槽
vue的插槽需要在組件中定義slot標籤，並且在引用的時候要對應slot標籤上的插槽名。 react的插槽直接將dom寫到組件的標籤下然後子組件通過this.props.children獲取到放入的dom元素，這個dom元素可以設置key
2020-02-22 16:18:57