close
logologo
指南
配置
插件
API
社区
版本
更新日志
Rsbuild 0.x 文档
English
简体中文
指南
配置
插件
API
社区
更新日志
Rsbuild 0.x 文档
English
简体中文
logologo

开始

介绍
快速上手
功能导航
名词解释

框架

React
Vue
Preact
Svelte
Solid

基础

命令行工具
开发服务器
构建产物
静态资源
HTML
JSON
Wasm
TypeScript
Web Workers
部署静态站点
升级 Rsbuild

配置

配置 Rspack
配置 Rsbuild
配置 SWC

样式

CSS
CSS Modules
CSS-in-JS
Tailwind CSS v4
Tailwind CSS v3
UnoCSS

进阶

路径别名
环境变量
模块热更新
浏览器范围
浏览器兼容性
模块联邦
多环境构建
服务端渲染(SSR)
测试

优化

代码拆分
产物体积优化
提升构建性能
静态资源内联

迁移

从 Rsbuild 0.x 迁移
webpack
Create React App
Vue CLI
Vite
Vite 插件
Modern.js Builder

调试

开启调试模式
构建性能分析
使用 Rsdoctor

常见问题

通用类问题
功能类问题
异常类问题
热更新问题
📝 在 GitHub 上编辑此页
上一页Preact
下一页Solid

#Svelte

在这篇文档中,你可以了解到如何基于 Rsbuild 来构建一个 Svelte 应用。

#创建 Svelte 应用

使用 create-rsbuild 来创建一个基于 Rsbuild 的 Svelte 应用,运行以下命令:

npm
yarn
pnpm
bun
npm create rsbuild@latest

然后在 Select framework 时选择 Svelte 即可。

#在已有项目中使用 Svelte

为了能够编译 Svelte 组件(.svelte 文件),你需要注册 Rsbuild 的 Svelte 插件,插件会自动添加 Svelte 构建所需的配置。

例如,在 rsbuild.config.ts 中注册:

rsbuild.config.ts
import { defineConfig } from '@rsbuild/core';
import { pluginSvelte } from '@rsbuild/plugin-svelte';

export default defineConfig({
  plugins: [pluginSvelte()],
});