pancakeswap 前端源码编译及部署-linux

区块链技术 5 4 月 22, 2024 0 区块链315

# 相关信息 - pancakeswap相关项目github地址：https://github.com/pancakeswap - pancakeswap前端源码github地址：https://github.com/pancakeswap/pancake-frontend # 一、源码编译环境部署 ## 1.1 yarn部署 - 安装源配置 ``` wget https://dl.yarnpkg.com/rpm/yarn.repo -O /etc/yum.repos.d/yarn.repo ``` - 安装yarn ``` yum install yarn -y ``` - 查看版本 ``` yarn --version ``` ## 1.2 nodejs 部署 - 下载nodejs二进制包 ``` wget https://nodejs.org/download/release/v12.20.0/node-v12.20.0-linux-x64.tar.xz ``` - 解压压缩包 ``` tar xvf node-v12.20.0-linux-x64.tar.xz ``` - 更改包名 ``` mv node-v12.20.0-linux-x64 /usr/local/nodejs ``` - 添加环境变量 ``` # vim /etc/profile #nodejs export NODE_HOME=/usr/local/nodejs export PATH=$NODE_HOME/bin:$PATH ``` - 生效环境变量 ``` source /etc/profile ``` - 验证nodejs是否部署成功 ``` # node -v v12.20.0 # npm -v 6.14.8 ``` ## 1.3 安装git - 安装git ``` yum -y install git ``` - 查看版本 ``` # git version git version 1.8.3.1 ``` # 二、pancakeswap 前端源码编译 ## 2.1 下载pancakeswap前端源码 - 下载pancakeswap前端源码压缩包 ``` https://github.com/pancakeswap/pancake-frontend/archive/refs/heads/master.zip ``` - 解压pancakeswap前端源码压缩包 ``` unzip master.zip ``` ## 2.2 编译pancakeswap前端源码 - 进入pancakeswap前端源码文件夹 ``` # cd pancake-frontend-master/ # ls CONTRIBUTING.md crowdin.yml cypress cypress.json doc LICENSE netlify.toml package.json public README.md scripts src static.json tsconfig.json yarn.lock ``` - 初始化git ``` git init ``` - 安装所有的依赖包 ``` yarn ``` - 项目下多了node_modules依赖包 ``` # ls CONTRIBUTING.md crowdin.yml cypress cypress.json doc LICENSE netlify.toml node_modules package.json public README.md scripts src static.json tsconfig.json yarn.lock ``` - 项目打包 ``` npm run build ``` - 编译后的静态页在build中 ``` # ls build CONTRIBUTING.md crowdin.yml cypress cypress.json doc LICENSE netlify.toml node_modules package.json public README.md scripts src static.json tsconfig.json yarn.lock ``` # 三、编译报错解决 ## 3.1 git未安装 - 报错内容： ``` Couldn't find the binary git ``` - 报错原因：没有安装git - 解决方法: ``` yum -y install git ``` ## 3.2 nodejs版本低 - 报错内容: ``` error extract-files@9.0.0: The engine "node" is incompatible with this module. Expected version "^10.17.0 || ^12.0.0 || >= 13.7.0". Got "10.12.0" error Found incompatible module. ``` - 报错原因：nodejs版本低 - 解决方法：将node升级至符合以下版本即可,个人本次使用版本为：v12.20.0 ``` ^10.17.0 || ^12.0.0 || >= 13.7.0 ``` ## 3.3 git没有初始化 - 报错内容: ``` fatal: Not a git repository (or any parent up to mount point /opt) ``` - 报错原因：git安裝后没有初始化 - 解决方法：初始化git ``` git init ``` ## 3.4 git无法被找到 - 报错内容: ``` .git can't be found (see https://git.io/Jc3F9) error Command failed with exit code 1. ``` - git无法被找到 - 解决方法：在源码文件夹路径下初始化git ``` # git init Initialized empty Git repository in /opt/tools/pancake-frontend-master/.git/ ``` # 四、部署pancakeswap前端网页 ## 4.1 下载nginx镜像 ``` docker pull nginx:1.17.9 ``` ## 4.2 新建nginx挂载目录 ``` mkdir -p /opt/docker/nginx/{conf,html,logs,cert} ``` ## 4.3 编写nginx容器启动脚本 ``` # pwd /opt/docker/nginx # vim run.sh #!/bin/bash docker run -itd --restart=unless-stopped \ -v /etc/localtime:/etc/localtime \ -v /etc/timezone:/etc/timezone \ --network=host \ --name nginx \ -v /opt/docker/nginx/html:/usr/share/nginx/html \ -v /opt/docker/nginx/logs:/var/log/nginx \ -v /opt/docker/nginx/cert:/etc/nginx/cert \ -v /opt/docker/nginx/nginx.conf:/etc/nginx/nginx.conf \ -v /opt/docker/nginx/conf:/etc/nginx/conf.d \ nginx:1.17.9 docker logs -f nginx ``` ## 4.4 编写nginx主配置文件 ``` # pwd /opt/docker/nginx # vim nginx.conf worker_processes 4; user nginx; #pid /opt/app/nginx/sbin/nginx.pid; events { worker_connections 409600; } http { include mime.types; default_type application/octet-stream; server_tokens off; autoindex on; autoindex_exact_size off; autoindex_localtime on; keepalive_timeout 65; log_format main '$remote_addr - $remote_user [$time_local] "$request" ' '$status $body_bytes_sent "$http_referer" ' '"$http_user_agent" "$http_x_forwarded_for"'; access_log /var/log/nginx/access.log main; error_log /var/log/nginx/error.log error; include /etc/nginx/conf.d/*.conf; } ``` ## 4.5 將编译好的pancakeswap前端静态页放到nginx项目目录下 ``` # mkdir /opt/docker/nginx/html/pancakeswap -p # cd /opt/docker/nginx/html/pancakeswap # cp /opt/tools/pancake-frontend-master/build/* ./ -rf # ls asset-manifest.json favicon.ico googlefddf3c367e79f9e2.html images index.html locales logo.png manifest.json _redirects robots.txt static swap.mp3 ``` ## 4.6 编写域名conf文件 ``` # pwd /opt/docker/nginx/conf # vim www.pancakeswap.com.conf server { listen 80; server_name www.pancakeswap.com; rewrite ^ https://$http_host$request_uri? permanent; server_tokens off; } server { listen 443 ssl; server_name 127.0.0.1; ssl_certificate /etc/nginx/cert/xxx.com.pem; ssl_certificate_key /etc/nginx/cert/xxx.com.key; ssl_session_timeout 5m; ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4; ssl_protocols TLSv1 TLSv1.1 TLSv1.2; ssl_prefer_server_ciphers on; charset utf-8; location / { root /usr/share/nginx/html/pancakeswap; index index.php index.html index.htm; } access_log /var/log/nginx/www.pancakeswap.com.log; error_log /var/log/nginx/www.pancakeswap.com.log; } ``` ## 4.7 启动容器，访问网页

一、源码编译环境部署

1.1 yarn部署

安装源配置

wget https://dl.yarnpkg.com/rpm/yarn.repo -O /etc/yum.repos.d/yarn.repo

安装yarn

yum install yarn -y

查看版本

yarn --version

1.2 nodejs 部署

下载nodejs二进制包

wget https://nodejs.org/download/release/v12.20.0/node-v12.20.0-linux-x64.tar.xz

解压压缩包

tar xvf node-v12.20.0-linux-x64.tar.xz

更改包名

mv node-v12.20.0-linux-x64 /usr/local/nodejs

添加环境变量

# vim /etc/profile
#nodejs
export NODE_HOME=/usr/local/nodejs
export PATH=$NODE_HOME/bin:$PATH

生效环境变量

source /etc/profile

验证nodejs是否部署成功

# node -v
v12.20.0

# npm -v
6.14.8

1.3 安装git

安装git

yum -y install git

查看版本

# git version
git version 1.8.3.1

二、pancakeswap 前端源码编译

2.1 下载pancakeswap前端源码

下载pancakeswap前端源码压缩包

https://github.com/pancakeswap/pancake-frontend/archive/refs/heads/master.zip

解压pancakeswap前端源码压缩包

unzip master.zip

2.2 编译pancakeswap前端源码

进入pancakeswap前端源码文件夹

# cd pancake-frontend-master/
# ls
CONTRIBUTING.md  crowdin.yml  cypress  cypress.json  doc  LICENSE  netlify.toml  package.json  public  README.md  scripts  src  static.json  tsconfig.json  yarn.lock

初始化git

git init

安装所有的依赖包

yarn

项目下多了node_modules依赖包

# ls
CONTRIBUTING.md  crowdin.yml  cypress  cypress.json  doc  LICENSE  netlify.toml  node_modules  package.json  public  README.md  scripts  src  static.json  tsconfig.json  yarn.lock

项目打包

npm run build

编译后的静态页在build中

# ls
build  CONTRIBUTING.md  crowdin.yml  cypress  cypress.json  doc  LICENSE  netlify.toml  node_modules  package.json  public  README.md  scripts  src  static.json  tsconfig.json  yarn.lock

三、编译报错解决

3.1 git未安装

报错内容：

Couldn't find the binary git

报错原因：没有安装git
解决方法:

yum -y install git

3.2 nodejs版本低

报错内容:

error extract-files@9.0.0: The engine "node" is incompatible with this module. Expected version "^10.17.0 || ^12.0.0 || >= 13.7.0". Got "10.12.0"
error Found incompatible module.

报错原因：nodejs版本低
解决方法：将node升级至符合以下版本即可,个人本次使用版本为：v12.20.0

^10.17.0 || ^12.0.0 || >= 13.7.0

3.3 git没有初始化

报错内容:

fatal: Not a git repository (or any parent up to mount point /opt)

报错原因：git安裝后没有初始化
解决方法：初始化git

git init

3.4 git无法被找到

报错内容:

.git can't be found (see https://git.io/Jc3F9)
error Command failed with exit code 1.

git无法被找到
解决方法：在源码文件夹路径下初始化git

# git init
Initialized empty Git repository in /opt/tools/pancake-frontend-master/.git/

四、部署pancakeswap前端网页

4.1 下载nginx镜像

docker pull nginx:1.17.9

4.2 新建nginx挂载目录

mkdir -p /opt/docker/nginx/{conf,html,logs,cert}

4.3 编写nginx容器启动脚本

# pwd
/opt/docker/nginx

# vim run.sh 
#!/bin/bash

docker run -itd --restart=unless-stopped \
 -v /etc/localtime:/etc/localtime \
 -v /etc/timezone:/etc/timezone \
 --network=host \
 --name nginx \
 -v /opt/docker/nginx/html:/usr/share/nginx/html \
 -v /opt/docker/nginx/logs:/var/log/nginx \
 -v /opt/docker/nginx/cert:/etc/nginx/cert \
 -v /opt/docker/nginx/nginx.conf:/etc/nginx/nginx.conf \
 -v /opt/docker/nginx/conf:/etc/nginx/conf.d \
 nginx:1.17.9

docker logs -f nginx

4.4 编写nginx主配置文件

# pwd
/opt/docker/nginx

# vim nginx.conf
worker_processes  4;
user  nginx;
#pid /opt/app/nginx/sbin/nginx.pid;
events {
    worker_connections  409600;
}
http {
    include       mime.types;
    default_type  application/octet-stream;
    server_tokens  off;
    autoindex on;
    autoindex_exact_size off;
    autoindex_localtime on;
    keepalive_timeout  65;
    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';
    access_log /var/log/nginx/access.log  main;
    error_log  /var/log/nginx/error.log  error;
    include /etc/nginx/conf.d/*.conf;
}

4.5 將编译好的pancakeswap前端静态页放到nginx项目目录下

# mkdir /opt/docker/nginx/html/pancakeswap -p
# cd /opt/docker/nginx/html/pancakeswap
# cp /opt/tools/pancake-frontend-master/build/* ./ -rf

# ls
asset-manifest.json  favicon.ico  googlefddf3c367e79f9e2.html  images  index.html  locales  logo.png  manifest.json  _redirects  robots.txt  static  swap.mp3

4.6 编写域名conf文件

# pwd
/opt/docker/nginx/conf

# vim www.pancakeswap.com.conf

server {
        listen       80;
        server_name www.pancakeswap.com;
        rewrite ^ https://$http_host$request_uri? permanent;
        server_tokens off;
    }
server {
        listen 443 ssl;
        server_name  127.0.0.1;
        ssl_certificate   /etc/nginx/cert/xxx.com.pem;
        ssl_certificate_key  /etc/nginx/cert/xxx.com.key;
        ssl_session_timeout 5m;
        ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
        ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
        ssl_prefer_server_ciphers on;
        charset utf-8;
        location / {
            root /usr/share/nginx/html/pancakeswap;
            index  index.php index.html index.htm;
        }
        access_log /var/log/nginx/www.pancakeswap.com.log;
        error_log /var/log/nginx/www.pancakeswap.com.log;
}

4.7 启动容器，访问网页

本文参与登链社区写作激励计划，好文好收益，欢迎正在阅读的你也加入。

发表于 2021-09-28 19:40
阅读 ( 691 )
学分 ( 4 )
分类：DeFi

打赏赞

pancakeswap 前端源码编译及部署-linux

相关信息

一、源码编译环境部署

1.1 yarn部署

1.2 nodejs 部署

1.3 安装git

二、pancakeswap 前端源码编译

2.1 下载pancakeswap前端源码

2.2 编译pancakeswap前端源码

三、编译报错解决

3.1 git未安装

3.2 nodejs版本低

3.3 git没有初始化

3.4 git无法被找到

四、部署pancakeswap前端网页

4.1 下载nginx镜像

4.2 新建nginx挂载目录

4.3 编写nginx容器启动脚本

4.4 编写nginx主配置文件

4.5 將编译好的pancakeswap前端静态页放到nginx项目目录下

4.6 编写域名conf文件

4.7 启动容器，访问网页

近期文章

热门

标签

评论

取消回复

相关信息

一、源码编译环境部署

1.1 yarn部署

1.2 nodejs 部署

1.3 安装git

二、pancakeswap 前端源码编译

2.1 下载pancakeswap前端源码

2.2 编译pancakeswap前端源码

三、编译报错解决

3.1 git未安装

3.2 nodejs版本低

3.3 git没有初始化

3.4 git无法被找到

四、部署pancakeswap前端网页

4.1 下载nginx镜像

4.2 新建nginx挂载目录

4.3 编写nginx容器启动脚本

4.4 编写nginx主配置文件

4.5 將编译好的pancakeswap前端静态页放到nginx项目目录下

4.6 编写域名conf文件

4.7 启动容器，访问网页

近期文章

热门

标签

相似推荐

评论

取消回复