pancake-swap-interface-v1功能有限,v2暂时还没有开源;而且关于pancake-frontend前端工程如何配置还没有一个详细完整的教程。在此,笔者将pancakeswap前端工程pancake-frontend配置成本地的hardhat测试网络环境,方便大家一起学习、使用。
已经有相关的文章教程可以将pancake-swap-interface-v1
部署到以太坊类链上了,
例如:
但是,pancake-swap-interface-v1只有swap和liquidity的功能,没有farm等质押等功能;
v1已经弃用,pancake-swap-interface-v2暂时还没有开源;
而且关于pancake-frontend前端工程如何配置还没有一个详细完整的教程。
在此,笔者将pancake前端工程pancake-frontend配置成本地的hardhat测试网环境,方便大家一起学习,同理更改配置,如chanid 等也可以在以太坊测试网(如goerli等)使用。
项目的完整地址在: https://github.com/chobynleo/pancake-swap-frontend-hardhat-testnet
下载之后安装运行也很方便,以下是运行命令:
## 环境要求
`nvm use 12`
## 安装依赖
`sh install.sh`
## 开启服务
`sh serve.sh`
## 一键部署
`sh deploy.sh`
## 运行项目
`sh start.sh`
如果你想亲自配置Pancake-frontend的过程,并构建自己的测试网络环境,
下面将告诉你哪些文件需要修改,
以下是相应的配置教程: (转载请注明出处)
1.下载pancake-swap-core
源码
git clone git@github.com:pancakeswap/pancake-swap-core.git
yarn install
yarn compile
2.下载pancake-swap-periphery
源码
git clone git@github.com:pancakeswap/pancake-swap-periphery.git
yarn install
yarn compile
3.下载pancake-swap-interface-v1
前端源码
git clone git@github.com:pancakeswap/pancake-swap-interface-v1.git
yarn install
tip:安装过程出现import @uniswap/v2-core/contracts/interfaces/IPancakePair.sol
编译报错问题 参考登链社区的回答
合约地址的源码可以到
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.ts
src/config/constants/pools.ts
src/config/constants/ifo.ts
src/config/constants/pricehelper.ts
src/config/constants/contract.ts
如果觉得我的文章对您有用,请随意打赏。你的支持将鼓励我继续创作!