在Heroku上部署react App

前段时间研究了下react/redux，总算搞清楚了大概，我为啥研究这个呢，其实我对具体技术兴趣不是太执着，我主要想做个去中心化产品，演示给人看，希望寻找志同道合的人，没有谁比我更懂得这个产品了，也找不到人做，我就自己做了。为了这个玩意，我之前还研究了智能合约，solidity，truffle framework，metamask等等，哥就是这么执着的人。好在我近阶段只做个demo，所以我大概总共花了2周时间，然后我就把它部署到Heroku上去，往这上面部署东西我已经不是第一次了，部署过程只要follow它的"Deploy"菜单下的命令就可以了。

当然，如果一切顺利，我也不想写这个博客了，就是因为不顺，所以我才记录下来，一来为后人踩雷，二来以后我遇到类似的雷，也记得怎么去排。首先我遇到的问题就是部署失败，我开始还不知道部署失败了，直到运行网页才发现怎么app error了 ？ 所以我就用Heroku logs去看怎么回事。里头有个重要提示：

content not from webpack is served from /app/public

所以我就以此为关键词去问谷歌，谷歌告诉我：因为Heroku缺省用nodejs编译部署我这种项目，我们需要用Create react App来部署，可能因为react出来的时间不算太久吧。不过好歹也是2013年5月在JSConf US开源的呀，不算太晚啊。

首先，用这个命令看看我当前用什么来部署的，一看，果然是nodejs的，这里appname就是我在Heroku上建立工程的名字。

heroku buildpacks -a <appname>

然后，用这个命令来让Heroku用reactjs那套玩意来部署：

heroku create $APP_NAME --buildpack mars/create-react-app

最后，我不是要重新部署嘛，用下面的命令，如果简单push，它会觉得你没有任何变化，干嘛还要部署，就啥也不干了。

git commit --allow-empty -m "Trigger Heroku deploy after enabling collectstatic"
git push heroku master

用heroku open 打开部署后的网站就可以看到结果了。

Heroku上有个链接，专门说明这个事情，不过我也没空全部看完，人心真是浮躁啊。

部署完，运行又出现了问题，本来我本地运行好好的，但是到了Heroku上，它对bignumber就不认了，所谓bignumber，就是类似100010*18（1000000000000000000000）这样的大数，JavaScript只支持最多2 ^ 53-1的数字，后来查了查，可能是Heroku上的bignumber.js文件跟我本机不一样，这玩意怎么整？我还真不知道，所以我一不做，二不休，把数字换成字符串，这个问题就解决了，具体就是这样：

var priceUnit = this.web3.utils.toBN(price).mul(this.web3.utils.toBN(this.web3.utils.toWei("1"))).toString()