Meteor 3 Svelte 教程使用meteor create --svelte创建你的第一个响应式应用【免费下载链接】meteorMeteor, the JavaScript App Platform项目地址: https://gitcode.com/gh_mirrors/me/meteor本教程以 Meteor 官方 Svelte 教程的第一步 v3-docs/docs/tutorials/svelte/1.creating-the-app.md 为骨架完整讲解如何从零搭建一个基于Meteor 3.4Rspack 打包器与 Svelte 5的 To-do 应用从安装 Meteor、meteor create --svelte脚手架生成、理解client/server/imports/ui目录结构到编写第一个渲染任务列表的 Svelte 组件、移动端视口适配以及 Meteor 3.4 内置的 Hot Module ReplacementHMR开发体验。读完本文你将掌握 Meteor 与 Svelte 集成的基础工程结构与数据渲染链路为后续章节接入 MongoDB 集合、表单事件与用户账户系统打下坚实基础。1. 安装 Meteor在创建项目之前首先需要在你的开发机上安装 Meteor。官方提供了覆盖 macOS、Linux 与 Windows 的安装方式详见仓库内的 安装文档。安装完成后在终端验证版本可用meteor --versionMeteor 是 JavaScript 应用平台其运行时自带 Node.js 与 MongoDB因此你无需单独安装 MongoDB——Meteor 会为每个项目提供开箱即用的嵌入式 MongoDB 实例这一点在第 2 节创建项目后即可验证。2. 创建 Meteor Svelte 项目2.1 使用meteor create --svelte创建 Svelte 项目最简单的方式是使用meteor create命令并传入--svelte选项与项目名meteor create --svelte simple-todos-svelteMeteor 会自动生成项目所需的全部文件。--svelte选项会让 Meteor 生成一个使用Svelte 5与Rspack作为打包器的项目这也是本教程所采用的方式。在仓库的 CLI 帮助文档 tools/cli/help.txt 中可以看到meteor create支持--react、--vue、--svelte、--blaze、--solid、--tailwind、--chakra-ui、--apollo、--angular、--typescript等多种脚手架模板其中--svelte的说明为 Create a basic svelte-based app。使用 Rspack 打包器 是 Meteor 3.4 的默认约定它能显著提升开发速度、解锁更多构建特性并让开发者对打包体积与配置拥有更好的掌控。说明官方同时提供了 Rspack 与 Meteor bundler旧版打包器两个版本的最终应用本教程基于 Rspack 版本讲解最终应用状态一致Meteor bundler 版本供偏好旧版打包器的读者参考。2.2 认识生成的项目结构创建完成后先快速浏览 Meteor 生成的文件不必立刻理解每一个细节但需要知道它们各自的位置client目录负责你的客户端Web侧。例如client/main.html是 HTML 入口点Meteor 会把你的 App 主组件渲染进其中的容器元素。server目录负责你的服务端Node.js侧。server/main.js是初始化 MongoDB 数据库、写入种子数据的理想位置——如前所述无需额外安装 MongoDBMeteor 内置了可直接使用的嵌入式版本。imports/ui目录存放你的 Svelte 组件代码App.svelte将是这个 Svelte To-do 应用的根组件。2.3 启动应用进入项目根目录运行meteor应用默认运行在3000 端口。从现在起Meteor 会持续监听你的代码变更并保持应用同步更新。3. 创建任务替换默认脚手架代码现在开始编写我们的 To-do 应用。首先将默认 starter 应用的代码替换为下面的内容稍后我们逐一讲解每段代码的作用。3.1 简化 HTML 入口点将client/main.html简化为如下内容head titleSimple todo/title /head body div idapp/div /bodydiv idapp/div就是根 Svelte 组件的挂载目标。3.2 编写客户端入口client/main.jsclient/main.js负责导入并渲染主 Svelte 组件。注意这里使用了 Svelte 5 的mount/unmount编程式挂载 API并处理了 HMR 场景下的重挂载与清理import { Meteor } from meteor/meteor; import App from ../imports/ui/App.svelte; import { mount, unmount } from svelte; let app; // will hold the mounted instance Meteor.startup(() { const target document.getElementById(app); // (Re)mount app mount(App, { target }); // Clean up on HMR so we dont double-mount if (import.meta.webpackHot) { import.meta.webpackHot.accept(); import.meta.webpackHot.dispose(() { if (app) { // pass the instance you got from mount() unmount(app, { outro: false }); // set outro:true if you want transitions app null; } // optional: clear target to be extra safe target.innerHTML ; }); } });关键点Meteor.startup(() {...})保证在客户端环境就绪后执行挂载逻辑mount(App, { target })是 Svelte 5 推荐的组件挂载方式替代旧版new App({ target })import.meta.webpackHot.accept()/dispose()用于 HMR在模块热替换时先unmount旧实例避免组件重复挂载。若需要过渡动画可将unmount(app, { outro: true })。3.3 编写根组件imports/ui/App.svelte在imports/ui目录下修改App.svelte显示一个标题和任务列表script import { Meteor } from meteor/meteor; let tasks [ { text: This is task 1 }, { text: This is task 2 }, { text: This is task 3 }, ]; /script div classcontainer header h1Todo List/h1 /header ul {#each tasks as task (task.text)} li{task.text}/li {/each} /ul /div我们修改了主 Svelte 组件App.svelte它会被渲染到 body 中的#appdiv 内显示一个标题和任务列表。目前尚未连接服务器与数据库因此使用静态示例数据展示任务。4. 查看示例任务由于还没有连接服务器和数据库我们在App.svelte中直接定义了示例数据来渲染任务列表。此时meteor应已运行在 3000 端口打开 http://localhost:3000/ 即可看到包含三个任务的列表。如果 meteor 未在运行请回到终端、进入项目根目录输入meteor并回车启动应用。5. 数据渲染链路解析下面这张流程图v3-docs/docs/tutorials/svelte/assets/mermaid-diagram-svelte-rendering.png直观地展示了「从脚手架命令到任务列表渲染」的完整数据流最上层是初始化命令meteor create --svelte simple-todos-svelte它生成三条分支client/main.htmlHTML 入口、client/main.js导入并挂载App.svelte以及server/main.js初始化服务器与嵌入式 MongoDBclient/main.js将imports/ui/App.svelte挂载到#app容器App.svelte中定义了tasks数组通过 Svelte 模板语法{#each tasks as task}遍历数组并用{task.text}插值每个任务的text属性最终渲染出 Header 和任务列表。在 Meteor 中使用 Svelte 时你的主入口是client/main.js它导入并把根组件App.svelte挂载到 HTML 中的目标元素如div idapp/div。Svelte 组件定义在.svelte文件中可以包含script、style与 HTML 标记。HTML 标记可以使用 Svelte 的模板语法例如{#each}用于循环、{expression}用于数据插值。你可以在script标签中定义响应式数据与逻辑。上面的代码直接在组件中定义了一个tasks数组在标记中用{#each tasks as task}遍历数组并用{task.text}显示每个任务的text属性。关于 Meteor 特定的响应式对于订阅subscriptions和集合collections这类 Meteor 特定的响应式机制Meteor 中的 Svelte 使用Tracker与响应式变量来接入 Meteor 的响应式系统。这部分内容将在后续章节接入 MongoDB 集合时详细介绍。6. 移动端观感与视口适配6.1 用 DevTools 模拟移动设备查看应用在手机上的表现可以模拟移动环境在浏览器以 Google Chrome 为例中右键点击应用页面选择inspect打开DevTools。DevTools 工具栏中有一个手机/平板设备切换图标v3-docs/docs/tutorials/svelte/assets/step01-dev-tools-mobile-toggle.png点击后在顶部导航栏选择要模拟的手机型号。也可以直接用真实手机访问在手机浏览器地址栏输入你电脑的本地 IP。获取本地 IP 的命令Unix 系统ifconfig | grep inet | grep -Fv 127.0.0.1 | awk {print $2}Windows 命令提示符ipconfig | findstr IPv4 Address6.2 添加移动端 meta 标签未做视口适配时页面内容会整体显示得很小v3-docs/docs/tutorials/svelte/assets/step01-mobile-without-meta-tags.png因为浏览器没有针对移动设备调整 viewport。要修复此问题以及其他同类问题在client/main.html的head标签内、title之后加入以下 meta 标签... meta charsetutf-8/ meta http-equivx-ua-compatible contentieedge/ meta nameviewport contentwidthdevice-width, heightdevice-height, viewport-fitcover, initial-scale1, maximum-scale1, minimum-scale1, user-scalableno / meta namemobile-web-app-capable contentyes/ meta nameapple-mobile-web-app-capable contentyes/ ...这些标签的作用charsetutf-8声明 UTF-8 字符编码http-equivx-ua-compatible contentieedge兼容 IE/Edge 渲染模式viewportwidthdevice-width使页面宽度匹配设备宽度initial-scale1设置初始缩放比例maximum-scale1/minimum-scale1/user-scalableno限制用户缩放常见于移动端应用类页面mobile-web-app-capable与apple-mobile-web-app-capable声明应用支持添加到主屏幕的全屏 Web App 体验。添加之后应用即可在移动设备上正确缩放v3-docs/docs/tutorials/svelte/assets/step01-mobile-with-meta-tags.png7. 热模块替换HMR与开发体验7.1 Meteor 3.4 默认内置 HMR从 Meteor 3.4 开始新应用默认使用 Rspack 打包器它内置了Hot Module ReplacementHMR与 solid-refresh 支持。这意味着你在开发时所做的改动可以即时呈现在页面上且不会丢失组件状态。仓库中的端到端测试 tools/e2e-tests/svelte.test.js 验证了这一点它使用testMeteorRspackBundler对名为svelte的示例应用做 MeteorRspack 打包测试并断言开发模式下重建后控制台出现HMR Updated modules:输出而生产模式下则不应出现 HMR 输出——这正是「Rspack 默认启用 HMR、生产构建关闭 HMR」的行为验证。7.2 旧版本hot-module-replacement 包如果你使用的是 Meteor 3.4 之前的版本可以选用 hot-module-replacement 包新项目已默认包含。该包会在重建过程中更新正在运行的应用里被修改的 JavaScript 模块缩短开发反馈周期——甚至在构建完成之前就更新应用——同时保留你的应用状态。警告在 Meteor 3.4 启用rspackAtmosphere 包的应用中hot-module-replacement仍可添加但它仅作为仍由 Meteor bundler 编译的模块如 Atmosphere 包或显式保留在 Meteor bundler 侧的任意文件的 HMR 策略。关于 Rspack 与 Meteor bundler 的协作方式可参考 Rspack Bundler 集成文档在该架构下Rspack 打包应用代码Meteor Bundler 产出最终输出从而保持对 Atmosphere 包等 Meteor 特性的支持。Rspack 集成会保留_build/*、{public,private}/build-assets/*、{public,private}/build-chunks/*等自动生成的构建目录并需要应用在package.json的meteor.mainModule中声明client与server入口点{ meteor: { mainModule: { client: client/main.js, server: server/main.js } } }7.3 从zodern:melte过渡到标准 Svelte 响应式在旧版 Meteor 中Svelte 的响应式常由zodern:melte等包提供它引入了$m:之类的语法糖。但在 Meteor 3.4 使用 Rspack 打包器后官方转向了与最新 Svelte 版本兼容的更标准的方式。警告zodern:melte包不兼容Meteor Rspack 应用即 Meteor 3.4 使用rspack包的项目。这次过渡带来了显著优势支持最新版本的 Svelte 5并更好地兼容更广泛的 Svelte 生态。虽然失去了一些语法糖辅助但换来的是更标准、更具前瞻性的实现它将随 Svelte 本身一起演进。7.4 浏览器内错误提示dev-error-overlay在旧版本中你还可以添加 dev-error-overlay 包以便直接在浏览器中看到错误而不只是在控制台meteor add dev-error-overlay添加后故意制造一些错误你会看到错误直接显示在浏览器页面上。该包的源码位于 packages/dev-error-overlay其作用是显著缩短「报错 → 定位」的开发循环。8. 下一步至此你已经完成了 Meteor Svelte 应用的初始化理解了项目结构、Svelte 5 的mountAPI、#each渲染链路、移动端视口适配与 HMR 开发体验。下一步我们将接入 MongoDB 数据库把内存中的静态任务数据迁移到真正的集合Collection中从而支持任务的持久化存储。后续教程章节Svelte 教程目录将依次涵盖集合与数据连接2.collections、表单与事件3.forms-and-events、任务更新与删除4.update-and-remove、样式5.styles、任务过滤6.filter-tasks、用户账户7.adding-user-accounts以及部署8.deploying。【免费下载链接】meteorMeteor, the JavaScript App Platform项目地址: https://gitcode.com/gh_mirrors/me/meteor创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Meteor 3 + Svelte 教程：使用 `meteor create --svelte` 创建你的第一个响应式应用
Meteor 3 Svelte 教程使用meteor create --svelte创建你的第一个响应式应用【免费下载链接】meteorMeteor, the JavaScript App Platform项目地址: https://gitcode.com/gh_mirrors/me/meteor本教程以 Meteor 官方 Svelte 教程的第一步 v3-docs/docs/tutorials/svelte/1.creating-the-app.md 为骨架完整讲解如何从零搭建一个基于Meteor 3.4Rspack 打包器与 Svelte 5的 To-do 应用从安装 Meteor、meteor create --svelte脚手架生成、理解client/server/imports/ui目录结构到编写第一个渲染任务列表的 Svelte 组件、移动端视口适配以及 Meteor 3.4 内置的 Hot Module ReplacementHMR开发体验。读完本文你将掌握 Meteor 与 Svelte 集成的基础工程结构与数据渲染链路为后续章节接入 MongoDB 集合、表单事件与用户账户系统打下坚实基础。1. 安装 Meteor在创建项目之前首先需要在你的开发机上安装 Meteor。官方提供了覆盖 macOS、Linux 与 Windows 的安装方式详见仓库内的 安装文档。安装完成后在终端验证版本可用meteor --versionMeteor 是 JavaScript 应用平台其运行时自带 Node.js 与 MongoDB因此你无需单独安装 MongoDB——Meteor 会为每个项目提供开箱即用的嵌入式 MongoDB 实例这一点在第 2 节创建项目后即可验证。2. 创建 Meteor Svelte 项目2.1 使用meteor create --svelte创建 Svelte 项目最简单的方式是使用meteor create命令并传入--svelte选项与项目名meteor create --svelte simple-todos-svelteMeteor 会自动生成项目所需的全部文件。--svelte选项会让 Meteor 生成一个使用Svelte 5与Rspack作为打包器的项目这也是本教程所采用的方式。在仓库的 CLI 帮助文档 tools/cli/help.txt 中可以看到meteor create支持--react、--vue、--svelte、--blaze、--solid、--tailwind、--chakra-ui、--apollo、--angular、--typescript等多种脚手架模板其中--svelte的说明为 Create a basic svelte-based app。使用 Rspack 打包器 是 Meteor 3.4 的默认约定它能显著提升开发速度、解锁更多构建特性并让开发者对打包体积与配置拥有更好的掌控。说明官方同时提供了 Rspack 与 Meteor bundler旧版打包器两个版本的最终应用本教程基于 Rspack 版本讲解最终应用状态一致Meteor bundler 版本供偏好旧版打包器的读者参考。2.2 认识生成的项目结构创建完成后先快速浏览 Meteor 生成的文件不必立刻理解每一个细节但需要知道它们各自的位置client目录负责你的客户端Web侧。例如client/main.html是 HTML 入口点Meteor 会把你的 App 主组件渲染进其中的容器元素。server目录负责你的服务端Node.js侧。server/main.js是初始化 MongoDB 数据库、写入种子数据的理想位置——如前所述无需额外安装 MongoDBMeteor 内置了可直接使用的嵌入式版本。imports/ui目录存放你的 Svelte 组件代码App.svelte将是这个 Svelte To-do 应用的根组件。2.3 启动应用进入项目根目录运行meteor应用默认运行在3000 端口。从现在起Meteor 会持续监听你的代码变更并保持应用同步更新。3. 创建任务替换默认脚手架代码现在开始编写我们的 To-do 应用。首先将默认 starter 应用的代码替换为下面的内容稍后我们逐一讲解每段代码的作用。3.1 简化 HTML 入口点将client/main.html简化为如下内容head titleSimple todo/title /head body div idapp/div /bodydiv idapp/div就是根 Svelte 组件的挂载目标。3.2 编写客户端入口client/main.jsclient/main.js负责导入并渲染主 Svelte 组件。注意这里使用了 Svelte 5 的mount/unmount编程式挂载 API并处理了 HMR 场景下的重挂载与清理import { Meteor } from meteor/meteor; import App from ../imports/ui/App.svelte; import { mount, unmount } from svelte; let app; // will hold the mounted instance Meteor.startup(() { const target document.getElementById(app); // (Re)mount app mount(App, { target }); // Clean up on HMR so we dont double-mount if (import.meta.webpackHot) { import.meta.webpackHot.accept(); import.meta.webpackHot.dispose(() { if (app) { // pass the instance you got from mount() unmount(app, { outro: false }); // set outro:true if you want transitions app null; } // optional: clear target to be extra safe target.innerHTML ; }); } });关键点Meteor.startup(() {...})保证在客户端环境就绪后执行挂载逻辑mount(App, { target })是 Svelte 5 推荐的组件挂载方式替代旧版new App({ target })import.meta.webpackHot.accept()/dispose()用于 HMR在模块热替换时先unmount旧实例避免组件重复挂载。若需要过渡动画可将unmount(app, { outro: true })。3.3 编写根组件imports/ui/App.svelte在imports/ui目录下修改App.svelte显示一个标题和任务列表script import { Meteor } from meteor/meteor; let tasks [ { text: This is task 1 }, { text: This is task 2 }, { text: This is task 3 }, ]; /script div classcontainer header h1Todo List/h1 /header ul {#each tasks as task (task.text)} li{task.text}/li {/each} /ul /div我们修改了主 Svelte 组件App.svelte它会被渲染到 body 中的#appdiv 内显示一个标题和任务列表。目前尚未连接服务器与数据库因此使用静态示例数据展示任务。4. 查看示例任务由于还没有连接服务器和数据库我们在App.svelte中直接定义了示例数据来渲染任务列表。此时meteor应已运行在 3000 端口打开 http://localhost:3000/ 即可看到包含三个任务的列表。如果 meteor 未在运行请回到终端、进入项目根目录输入meteor并回车启动应用。5. 数据渲染链路解析下面这张流程图v3-docs/docs/tutorials/svelte/assets/mermaid-diagram-svelte-rendering.png直观地展示了「从脚手架命令到任务列表渲染」的完整数据流最上层是初始化命令meteor create --svelte simple-todos-svelte它生成三条分支client/main.htmlHTML 入口、client/main.js导入并挂载App.svelte以及server/main.js初始化服务器与嵌入式 MongoDBclient/main.js将imports/ui/App.svelte挂载到#app容器App.svelte中定义了tasks数组通过 Svelte 模板语法{#each tasks as task}遍历数组并用{task.text}插值每个任务的text属性最终渲染出 Header 和任务列表。在 Meteor 中使用 Svelte 时你的主入口是client/main.js它导入并把根组件App.svelte挂载到 HTML 中的目标元素如div idapp/div。Svelte 组件定义在.svelte文件中可以包含script、style与 HTML 标记。HTML 标记可以使用 Svelte 的模板语法例如{#each}用于循环、{expression}用于数据插值。你可以在script标签中定义响应式数据与逻辑。上面的代码直接在组件中定义了一个tasks数组在标记中用{#each tasks as task}遍历数组并用{task.text}显示每个任务的text属性。关于 Meteor 特定的响应式对于订阅subscriptions和集合collections这类 Meteor 特定的响应式机制Meteor 中的 Svelte 使用Tracker与响应式变量来接入 Meteor 的响应式系统。这部分内容将在后续章节接入 MongoDB 集合时详细介绍。6. 移动端观感与视口适配6.1 用 DevTools 模拟移动设备查看应用在手机上的表现可以模拟移动环境在浏览器以 Google Chrome 为例中右键点击应用页面选择inspect打开DevTools。DevTools 工具栏中有一个手机/平板设备切换图标v3-docs/docs/tutorials/svelte/assets/step01-dev-tools-mobile-toggle.png点击后在顶部导航栏选择要模拟的手机型号。也可以直接用真实手机访问在手机浏览器地址栏输入你电脑的本地 IP。获取本地 IP 的命令Unix 系统ifconfig | grep inet | grep -Fv 127.0.0.1 | awk {print $2}Windows 命令提示符ipconfig | findstr IPv4 Address6.2 添加移动端 meta 标签未做视口适配时页面内容会整体显示得很小v3-docs/docs/tutorials/svelte/assets/step01-mobile-without-meta-tags.png因为浏览器没有针对移动设备调整 viewport。要修复此问题以及其他同类问题在client/main.html的head标签内、title之后加入以下 meta 标签... meta charsetutf-8/ meta http-equivx-ua-compatible contentieedge/ meta nameviewport contentwidthdevice-width, heightdevice-height, viewport-fitcover, initial-scale1, maximum-scale1, minimum-scale1, user-scalableno / meta namemobile-web-app-capable contentyes/ meta nameapple-mobile-web-app-capable contentyes/ ...这些标签的作用charsetutf-8声明 UTF-8 字符编码http-equivx-ua-compatible contentieedge兼容 IE/Edge 渲染模式viewportwidthdevice-width使页面宽度匹配设备宽度initial-scale1设置初始缩放比例maximum-scale1/minimum-scale1/user-scalableno限制用户缩放常见于移动端应用类页面mobile-web-app-capable与apple-mobile-web-app-capable声明应用支持添加到主屏幕的全屏 Web App 体验。添加之后应用即可在移动设备上正确缩放v3-docs/docs/tutorials/svelte/assets/step01-mobile-with-meta-tags.png7. 热模块替换HMR与开发体验7.1 Meteor 3.4 默认内置 HMR从 Meteor 3.4 开始新应用默认使用 Rspack 打包器它内置了Hot Module ReplacementHMR与 solid-refresh 支持。这意味着你在开发时所做的改动可以即时呈现在页面上且不会丢失组件状态。仓库中的端到端测试 tools/e2e-tests/svelte.test.js 验证了这一点它使用testMeteorRspackBundler对名为svelte的示例应用做 MeteorRspack 打包测试并断言开发模式下重建后控制台出现HMR Updated modules:输出而生产模式下则不应出现 HMR 输出——这正是「Rspack 默认启用 HMR、生产构建关闭 HMR」的行为验证。7.2 旧版本hot-module-replacement 包如果你使用的是 Meteor 3.4 之前的版本可以选用 hot-module-replacement 包新项目已默认包含。该包会在重建过程中更新正在运行的应用里被修改的 JavaScript 模块缩短开发反馈周期——甚至在构建完成之前就更新应用——同时保留你的应用状态。警告在 Meteor 3.4 启用rspackAtmosphere 包的应用中hot-module-replacement仍可添加但它仅作为仍由 Meteor bundler 编译的模块如 Atmosphere 包或显式保留在 Meteor bundler 侧的任意文件的 HMR 策略。关于 Rspack 与 Meteor bundler 的协作方式可参考 Rspack Bundler 集成文档在该架构下Rspack 打包应用代码Meteor Bundler 产出最终输出从而保持对 Atmosphere 包等 Meteor 特性的支持。Rspack 集成会保留_build/*、{public,private}/build-assets/*、{public,private}/build-chunks/*等自动生成的构建目录并需要应用在package.json的meteor.mainModule中声明client与server入口点{ meteor: { mainModule: { client: client/main.js, server: server/main.js } } }7.3 从zodern:melte过渡到标准 Svelte 响应式在旧版 Meteor 中Svelte 的响应式常由zodern:melte等包提供它引入了$m:之类的语法糖。但在 Meteor 3.4 使用 Rspack 打包器后官方转向了与最新 Svelte 版本兼容的更标准的方式。警告zodern:melte包不兼容Meteor Rspack 应用即 Meteor 3.4 使用rspack包的项目。这次过渡带来了显著优势支持最新版本的 Svelte 5并更好地兼容更广泛的 Svelte 生态。虽然失去了一些语法糖辅助但换来的是更标准、更具前瞻性的实现它将随 Svelte 本身一起演进。7.4 浏览器内错误提示dev-error-overlay在旧版本中你还可以添加 dev-error-overlay 包以便直接在浏览器中看到错误而不只是在控制台meteor add dev-error-overlay添加后故意制造一些错误你会看到错误直接显示在浏览器页面上。该包的源码位于 packages/dev-error-overlay其作用是显著缩短「报错 → 定位」的开发循环。8. 下一步至此你已经完成了 Meteor Svelte 应用的初始化理解了项目结构、Svelte 5 的mountAPI、#each渲染链路、移动端视口适配与 HMR 开发体验。下一步我们将接入 MongoDB 数据库把内存中的静态任务数据迁移到真正的集合Collection中从而支持任务的持久化存储。后续教程章节Svelte 教程目录将依次涵盖集合与数据连接2.collections、表单与事件3.forms-and-events、任务更新与删除4.update-and-remove、样式5.styles、任务过滤6.filter-tasks、用户账户7.adding-user-accounts以及部署8.deploying。【免费下载链接】meteorMeteor, the JavaScript App Platform项目地址: https://gitcode.com/gh_mirrors/me/meteor创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考