动态发布网站和静态发布网站,网站正在建设中的,私人订制网站的建设的设计表,如何模仿网站模板网页截图生成代码#xff0c;我测试的效果一般 快速安装教程如下
1#xff0c;首先你得有OpenAI的账号
国内用这个代理就可以#xff1a; https://www.closeai-asia.com/ 充值一块钱#xff0c;在本项目中可以生成两次
2#xff0c;下载程序
下载程序压缩包#xff1…网页截图生成代码我测试的效果一般 快速安装教程如下
1首先你得有OpenAI的账号
国内用这个代理就可以 https://www.closeai-asia.com/ 充值一块钱在本项目中可以生成两次
2下载程序
下载程序压缩包https://github.com/abi/screenshot-to-code.git 解压后在程序根目录创建一个.env文件内容如下
OPENAI_API_KEY你的key
OPENAI_BASE_URLhttps://api.openai-proxy.org/v1上面哪个网站的代理接口地址然后把整个目录上传到服务器
3使用docker运行后端
这里只推荐docker进入程序根目录运行如下命令
docker-compose up -d --build命令执行完成后有两个端口7001是后台5173是前端 访问7001得到下面一段话就是成功了
Your backend is running correctly. Please open the front-end URL (default is http://localhost:5173) to use screenshot-to-code.4本地运行前端
上面docker起来后的前端是用不了的需要本地启一个前端 在我们的电脑上用vscode打开frontend项目 修改后端接口地址 在src/config.ts文件中修改127.0.0.1:7001地址为你的docker主机的地址 修改后的src/config.ts文件如下
// Default to false if set to anything other than true or unset
export const IS_RUNNING_ON_CLOUD import.meta.env.VITE_IS_DEPLOYED true || false;export const WS_BACKEND_URL import.meta.env.VITE_WS_BACKEND_URL || ws://192.168.1.173:7001;export const HTTP_BACKEND_URL import.meta.env.VITE_HTTP_BACKEND_URL || http://192.168.1.173:7001;export const PICO_BACKEND_FORM_SECRET import.meta.env.VITE_PICO_BACKEND_FORM_SECRET || null;安装依赖yarn 运行yarn dev 4打开网址http://localhost:5173/就可以使用了 点击网页中的虚线框上传一张图片生成代码
