首先要說明的是這個文章其實屬于翻譯或者說轉(zhuǎn)述，我是從google上搜索到了這篇原文，并且用它的構(gòu)建流程成功開發(fā)了一個擴展洒忧，很爽，速度很快够颠，五分鐘直接進入擴展開發(fā)熙侍，不需要花費太多的精力在構(gòu)建開發(fā)環(huán)境上，不過可能還會有一些不太方便的方履磨，下面會講到核行。 我們開始吧！
全局安裝 create-react-app
npm install –g create-react-app
構(gòu)建你的應用程序
請隨意命名
create-react-app reactextension
修改mainfest文件
進入你的開發(fā)目錄蹬耘，public/mainfest.json是你擴展的主要入口芝雪，刪除他的所有內(nèi)容，寫入如下內(nèi)容
chrome擴展將會依賴這個文件加載頁面
{
"short_name": "React App",
"name": "React Extension",
"manifest_version": 2,
"browser_action": {
"default_popup": "index.html",
"default_title": "React Ext"
},
"version": "1.0"
}
接下來你需要運行一次 yarn build 來初次打包综苔，你的程序?qū)敵龅?strong>dist文件內(nèi)
加載你的擴展程序
打開你的Chrome擴展中心chrome://extensions惩系，請確保勾選開發(fā)者模式位岔，拖入你的dist文件夾
OK! 恭喜你，你的應用程序應該已經(jīng)成功的加載到了chrome擴展列表中堡牡，快去嘗試打開它吧抒抬！如果你想要進一步的修改圖標名稱等，請修改mainfest文件晤柄，圖標圖片放置在public目錄中擦剑，這里要談到一點可惜之處，就是yarn dev模式下并不能加載這個擴展芥颈，我個人推薦你在dev模式下以一個普通網(wǎng)頁的方式去dubug一部分惠勒，待到累積一定功能的時候，再去build一下看看效果爬坑。
最后 來推薦一下我開發(fā)的擴展（已經(jīng)是第三次重寫了纠屋，前兩次都沒用框架，復用性確實比較差）
完全開源盾计，你完全可以clone下來自行編譯改進售担，從功能上講，他的主要目的就是幫我排雷署辉，評分特別低的片就不需要去看了族铆，同時爬了某電影資源網(wǎng)站的信息，可以進行快速的下載哭尝，你完全可以通過他來快速的查看最近有沒有值得看的爽片!
DaDa Movie for github
@Mackenzie Higa
最后骑素，感謝你們的閱讀! 有興趣可以來我的博客看看blog
