本文作者:chobyn[1]
已经有相关的文章教程可以将pancake-swap-interface-v1
部署到以太坊[2]类链上了, 例如:
如何将PancakeSwap部署到以太坊类链上[3]
但是,对于pancake-frontend
如何配置还没有一个详细完整的教程。在此,笔者将pancake前端工程pancake-frontend[4]配置成本地的hardhat[5]测试网环境,方便大家一起学习。
项目的完整地址在:https://github.com/chobynleo/pancake-swap-frontend-hardhat-testnet
Example
以下是相应的配置教程:(转载请注明出处)
一个基于pancake-frontend和hardhat的以太坊测试环境
工程文件的拉取与环境的配置
1.下载pancake-swap-core
源码git clone git@github.com:pancakeswap/pancake-swap-core.gityarn installyarn compile
2.下载pancake-swap-periphery
源码git clone git@github.com:pancakeswap/pancake-swap-periphery.gityarn installyarn compile
3.下载pancake-swap-interface-v1
前端源码git clone git@github.com:pancakeswap/pancake-swap-interface-v1.gityarn install
tip:安装过程出现import @uniswap/v2-core/contracts/interfaces/IPancakePair.sol
编译报错问题 参考登链社区[6]的回答
安装与部署
合约地址的源码可以到https://bscscan.com/address/your_address#code
下载
pancake-swap-core
目录下
安装hardhat
并编写部署文件PancakeFactory.sol
;
npm install --save-dev
hardhat npx hardhat
选择Create an empty hardhat.config.js
,并进行基本的solidity
版本设置、ALCHEMY_API_KEY
设置等;
创建scripts/deploy.js
并编写相应的部署脚本,注意要将你的账户地址赋值给feeToSetter
变量,传入合约的构造函数中,接着部署;
npx hardhat run scripts/deploy.js --network dev
保存INIT_CODE_PAIR_HASH
;
pancake-swap-periphery
目录下
安装hardhat
并编写部署文件PancakeRouter.sol
;
npm install --save-dev hardhat
npx hardhat
选择Create an empty hardhat.config.js
,并进行基本的solidity
版本设置、ALCHEMY_API_KEY
设置等;
找到PancakeLibrary.sol
里的pairFor
函数, 将其INIT_CODE_PAIR_HASH
的hex
更改为我们的INIT_CODE_PAIR_HASH
;
创建scripts/deploy.js
并编写相应的部署脚本,将PancakeFactory
的address和WETH
的address作为两个参数传入合约的构造函数中;
npx hardhat run scripts/deploy.js --network dev
遇到error:max code size exceeded
,解决的方法是将solidity->optimizer->runs
值设置为200;
pancake-frontend
目录下
以下将列出所有需要更改的文件:
ethers.providers.StaticJsonRpcProvider(RPC_URL)
的设置在src/utils/providers.ts
,参数在env.development
中的REACT_APP_NODE_PRODUCTION
;- 网络
url
配置的路径在PANCAKE-FRONTEND/src/config/constants/networks.ts
; testnet
网络中默认的token
配置也要更改,在src/config/constants/tokens.ts
;tokenlist
路径在src/config/constants/tokenlists/pancake-default.tokenlist.json
,但为了便于本地访问,在初始部署时我拷贝了到public/
里面,后续有需要更改的是public/
里面的值;PANCAKE_EXTENDED
、PANCAKE_TOP100
路径在src/config/constants/lists.ts
,FACTORY_ADDRESS
和INIT_CODE_HASH
的配置在node_modules/@pancakeswap/sdk/dist/constants.d.ts
,- 钱包连接网络的配置在
src/utils/wallet.ts
ROUTER_ADDRESS
的配置在src/config/constants/index.ts
;masterChef
、lotteryV2
、multiCall
等合约的地址配置在src/config/constants/contracts.ts
ABI
和address
的配置分别在config/abi/
,utils/addressHelpers
,其引用在src/utils/contractHelpers.ts
,src/hooks/useContract.ts
priceHelperLps
的配置在src/config/constants/priceHelperLps.ts
;src/state/farms/hooks.ts
里面的useFarmFromPid(251)
需要更改成正确的参数值src/config/index.ts
里面的BASE_BSC_SCAN_URLS,BASE_URL,BASE_BSC_SCAN_URL
需要更改成正确的参数值farm
和pools
,ifo
,pricehelper
,contracts
的里面的合约地址和网络chainId
需要更改,分别在src/config/constants/farm.tssrc/config/constants/pools.tssrc/config/constants/ifo.tssrc/config/constants/pricehelper.tssrc/config/constants/contract.ts
参考资料
[1]chobyn: https://learnblockchain.cn/people/5799
[2]以太坊: https://learnblockchain.cn/article/1201
[3]如何将PancakeSwap部署到以太坊类链上: https://learnblockchain.cn/article/2921
[4]pancake-frontend: https://github.com/pancakeswap/pancake-frontend
[5]hardhat: https://learnblockchain.cn/docs/hardhat/getting-started/
[6]登链社区: https://learnblockchain.cn/question/2055