Svelte 3.x如何实现类似微信PC版功能的网页聊天实例？

本文共计1616个文字，预计阅读时间需要7分钟。

基于Svelte3、SvelteKit、Sass仿微信Mac版聊天实战项目SvelteWebChat。结合svelte3、svelteKit、sass、mescroll.js、svelte-layer、svelte-scrollbar等技术搭建仿微信网页版聊天案例Svelte-Webchat。全新Dock菜单。

基于Svelte3+SvelteKit+Sass仿微信Mac界面聊天实战项目SvelteWebChat。

基于svelte3+svelteKit+sass+mescroll.js+svelte-layer+svelte-scrollbar等技术搭建仿微信网页版聊天案例Svelte-Webchat。全新的Dock菜单(可拖拽排序/鼠标滚轮左右滚动)，整体MacOs风格毛玻璃背景虚化效果。

一、使用技术

• 编辑器：Vscode
• 框架技术：Svelte^3.46.5+SvelteKit
• 状态管理：svelte/store
• 下拉刷新：mescroll.js
• 滚动条组件：svelte-scrollbar
• 对话框组件：svelte-layer
• sass预处理：sass^1.50.1+svelte-preprocess
• iconfont图标：阿里巴巴字体图标库

svelte-webchat：支持发送消息+emoj表情、图片/视频查看、链接预览、粘贴截图发送图片、红包/朋友圈、全屏/主题换肤等功能。