Complier Explorer的本地构建方法

安装本地Compiler Explorer的方法和步骤如下：

 1.环境要求： 

 1）采用ubuntu20.4系统 

 2）安装兼容的node版本，推荐使用node v20以上版本。

Node的安装命令如下： 

sudo apt update
sudo apt install nodejs

安装后检查node的版本，命令如下：

node –v

如果版本低于v20版本可以用npm工具升级，npm安装命令如下：

sudo apt update
sudo apt install npm

采用npm升级node版本的步骤如下：

a.安装 n 或 nvm（以 n 为例）：

npm install -g n

b.使用 n 升级 Node.js：

使用 n 工具安装其他特定版本的 Node.js，例如笔者使用了20.5.0版本命令如下：

 n 20.5.0

2.获取Compiler Explorer源码：

Compiler Explorer的源代码，可以在github或者gitcode上下载，链接地址如下：

github

https://github.com/compiler-explorer/compiler-explorer

gitcode

https://gitcode.com/compiler-explorer/compiler-explorer

3.安装依赖：

进入Compiler Explorer的源代码根目录，运行make命令来安装所有第三方库，使用npm安装服务器端和客户端组件。

笔者在安装过程中遇到如下报错

1）运行权限问题

报错信息如下：

make prebuild
make[1]: 进入目录“/home/zhangpeng/compiler-explorer”
make[1]: execvp: etc/scripts/find-node: 权限不够
make[1]: *** [Makefile:18：.node-bin] 错误 127
make[1]: 离开目录“/home/zhangpeng/compiler-explorer”
make: *** [Makefile:86：run] 错误 2

增加etc/scripts/find-node文件的可执行权限即可解决。

2）资源不足问题

报错信息如下：

webpack: compiling for production.
webpack: Limiting parallelism to 2
Killed
make[1]: *** [Makefile:77：prebuild] 错误 137
make[1]: 离开目录“/home/zhangpeng/compiler-explorer”
make: *** [Makefile:86：run] 错误 2

经过分析，怀疑系统资源不足，通过修改源代码目录下的webpack.config.esm.ts文件中的parallelism参数，可将该参数减小以降低系统资源占用，笔者将该参数调整为1，在次运行make后通过，成功后打印截图如下：

4.启动：

在Compiler Explorer的源代码根目录，运行make命令可以启动Compiler Explorer，默认在本地机器的端口10240上运行。您可以通过访问http://localhost:10240/来访问。

在火狐浏览器中运行效果如图：

​​​​​​​