【开源】查看网站在不同设备的预览效果

liaoliao (UID: 3248) 2022-7-11

2157 22

前几天看见泽泽社长发布的整了个网站多端缩略图在线生成工具于是也想做一个自己的多端预览工具，也算是写出来了（写的很渣）

开源出来和大伙一起交流一下 (可能会有不少兼容性问题)

这样以后网站更新就方便太多了不用去截图改图了

创意来自 web-multiterminal-preview

用的Vue3 + Vite（没有制作截屏功能）

可以预览你的网站在不同设备下的显示效果
可以自定义不同设备的网址
可以预览单个设备（点击设备边框即可）

预览地址

https://liaooo.cn/preview/

开源地址

Liaooo Multiterminal Preview

这家伙太懒了，什么也没留下。

已有评论 (22)

只看楼主倒序

是非题 (UID: 3226) @Ta
2022-7-11

1楼

很棒，赞一个
gogobody (UID: 3047) @Ta
2022-7-11

2楼

赞！
liaoliao (UID: 3248) 楼主 @Ta
2022-7-11

3楼

蝴蝶很棒，赞一个
谢谢！
liaoliao (UID: 3248) 楼主 @Ta
2022-7-11

4楼

gogobody 赞！
谢谢！
总版主 (UID: 2976) @Ta
2022-7-13 (Hui.Ke)

5楼

创意和展示都很棒，作为买不起ios系列的底层劳动人民希望能否再出一个ios端（iphone、ipad、mac）的效果
liaoliao (UID: 3248) 楼主 @Ta
2022-7-13

6楼

总版主创意和展示都很棒，作为买不起ios系列的底层劳动人民希望能否再出一个ios端（iphone、ipad、mac）的效果
其实这样机就是按着这是三个设备找的（iphone没有刘海是因为比较难处理，直接盖住了）这个涉及版权问题。
我自己不会做样机图片，所以应该是实现不了
凡梦星尘 (UID: 3243) @Ta
2022-7-13

7楼

测试了下，效果不还挺不错的呀，建议增加一键生成截图，并能设定图片的分辨率等实用的功能。另外说下在深色主题下，貌似左边的手机效果显示缺少了边框的效果。
liaoliao (UID: 3248) 楼主 @Ta
2022-7-13

8楼

凡梦星尘测试了下，效果不还挺不错的呀，建议增加一键生成截图，并能设定图片的分辨率等实用的功能。另外说下在深色主题下，貌似左边的手机效果显示缺少了边框的效果。
小改了一点，虽然可能还是没能解决你的问题
截图功能有尝试做过，没成功
十年_泽泽社长 (UID: 3027) @Ta
2022-7-14

9楼

liaoliao 小改了一点，虽然可能还是没能解决你的问题截图功能有尝试做过，没成功
想截图iframe太难了
2broear (UID: 3237) @Ta
2022-7-14

10楼

canvas可以截图
liaoliao (UID: 3248) 楼主 @Ta
2022-7-14

11楼

2broear canvas可以截图
试过没成功
liaoliao (UID: 3248) 楼主 @Ta
2022-7-14

12楼

泽泽社长想截图iframe太难了
对！
十年_清酒 (UID: 2994) @Ta
2022-7-14

13楼

还不错，就是有一件保存图片功能就好了
liaoliao (UID: 3248) 楼主 @Ta
2022-7-14

14楼

清酒还不错，就是有一件保存图片功能就好了       
其实我也想有这个功能
班班 (UID: 2975) @Ta
2022-7-15

15楼

好东西，已star+1
liaoliao (UID: 3248) 楼主 @Ta
2022-7-15

16楼

班班好东西，已star+1
谢谢！
tom (UID: 3123) @Ta
2022-7-16

17楼

超棒！！
liaoliao (UID: 3248) 楼主 @Ta
2022-7-16

18楼

tom 超棒！！
谢谢！！
十年_希恩 (UID: 2963) @Ta
2022-7-18

19楼

这是个VSCODE项目？为啥不用webstorm……
liaoliao (UID: 3248) 楼主 @Ta
2022-7-18

20楼

希恩这是个VSCODE项目？为啥不用webstorm……
一直用的vscode
dami (UID: 4460) @Ta
4月前 (www.dami.pub)

21楼

liaoliao 一直用的vscode
@liaoliao ，这个工具是不是对于被截图的网站有什么要求？为什么我有的网站可以显示，有的网站就不显示？

例如：dalao.net正常

但是：zhihu.com就显示不出来