云端极简部署Svelte3聊天室

一 、通过云开发平台快速创建初始化应用

1.创建相关应用模版请参考链接：尝鲜少代码高性能的Svelte框架

2.完成创建后就可以在github中查看到新增的Vite仓库

二 、 本地编写 Svelte3聊天室

1.将应用模版克隆到本地

• 首先假定你已经安装了Git、node，没有安装请移步node官网进行安装。克隆项目：

git clone + 项目地址

• 进入项目文件

cd Svelte

• 切换到feature/1.0.0 分支上

git checkout feature/1.0.0

• 安装依赖包

npm install

• 启动服务

npm run dev

这里打开浏览器8080端口，并出现默认页面。

2.项目结构目录

3.自定义导航栏Navbar+菜单栏Tabbar

项目中顶部导航条及底部菜单栏均是基于svelte定制开发的自定义组件。

4.自定义手机端弹窗组件

svelte-popup 一款基于Svelte3.x开发自定义多功能svPopup弹出框组件，支持超过20+参数自由配置、组件式+函数式混合调用方式。

5.config.js配置文件

如何在svelte.js项目中使用sass/less编写样式？可以安装 sass 及 svelte-preprocess 依赖。

/**
 * svelte.config.js基础配置文件
 */

import adapter from '@sveltejs/adapter-auto'
import path from 'path'
import SvelteProcess from 'svelte-preprocess'

/** @type {import('@sveltejs/kit').Config} */
const config = {
    kit: {
        adapter: adapter(),
        vite: {
            resolve: {
                alias: {
                    '@': path.resolve('./src'),
                    '@assets': path.resolve('./src/assets'),