将 svelte 应用程序构建为一组静态文件

2023-12-19

我想在我的下一个项目中使用 Svelte,因为它的语法简洁并且使用起来非常愉快。不幸的是,要在我的公司部署该应用程序,我无法使用node或服务器上类似的东西。我只能从以下位置提供应用程序nginx作为静态文件。

苗条有可能吗?我找不到任何可以让我做到这一点的东西,我尝试过的所有解决方案都像@sveltejs/adapter-static似乎没有正确生成它以这种方式使用它。我在网上找不到任何有关如何执行此操作的指南。


为了预渲染 SvelteKit 1.0 静态站点,您需要:

  1. 安装静态适配器npm i -D @sveltejs/adapter-static

  2. 将以下内容放入svelte.config.js

/**
 * from https://kit.svelte.dev/docs/adapter-static
 */
import adapter from '@sveltejs/adapter-static';

export default {
    kit: {
        adapter: adapter({
            // default options are shown. On some platforms
            // these options are set automatically — see below
            pages: 'build',
            assets: 'build',
            fallback: null,
            precompress: false,
            strict: true
        })
    }
};
  1. Add to devDependencies in package.json(您可以删除默认的适配器自动):
    "@sveltejs/adapter-static": "next",
  1. 添加以下行到src/routes/+layout.js- 如果文件不存在则创建该文件:
    export const prerender = true;
  1. Run npm run build

静态文件将生成在build目录。

更多详情请参见https://kit.svelte.dev/docs/adapter-static https://kit.svelte.dev/docs/adapter-static and https://github.com/sveltejs/kit/tree/master/packages/adapter-static#sveltejsadapter-static https://github.com/sveltejs/kit/tree/master/packages/adapter-static#sveltejsadapter-static

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

将 svelte 应用程序构建为一组静态文件 的相关文章

  • Angular - 如何从 DOM 中删除我使用过 $compile 的元素?

    我需要的是两个 ng views 的功能 因为我不能 我想更改某些内容的innerHTML 并编译它 我遇到的问题是 当我再次更改内容时 我可以编译 但是 Angular 是否会自行删除绑定 或者我必须手动执行此操作 如果是这样 怎么办 编
  • ReferenceError:regeneratorRuntime未定义(但在范围内工作)

    我遇到过这种奇怪的情况 ReferenceError regeneratorRuntime is not defined 我已经设法在一个非常小的设置中重现 与同一问题上的类似问题相比 并且还注意到一些奇怪的行为 具体取决于是否使用范围 以
  • 将鼠标悬停时的鼠标光标更改为锚状样式

    如果我将鼠标悬停在div鼠标光标将更改为 HTML 锚点中的光标 我怎样才能做到这一点 假设你的div has an id myDiv 将以下内容添加到您的 CSS 中 这cursor pointer指定光标应与用于锚点 超链接 的手形图标
  • 如何使用 JavaScript 创建链接?

    我有一个标题字符串和一个链接字符串 我不知道如何将两者放在一起以使用 JavaScript 在页面上创建链接 任何帮助表示赞赏 我试图解决这个问题的原因是因为我有一个 RSS 源并且有一个标题和 URL 列表 我想将标题链接到 URL 以使
  • Javascript 函数查找数字的倍数

    创建一个名为的函数multiplesOf 它将接受两个参数 第一个参数是数字数组 第二个参数是数字 该函数应返回一个新数组 该数组由参数数组中的每个数字组成 该数字是参数数字的倍数 So multiplesOf 5 6 7 8 9 10 3
  • 以编程方式填写reactjs表单

    我正在编写一个用户脚本 但无法填写由reactjs制作的表单 我的代码 document querySelector id username value email protected cdn cgi l email protection
  • Three.js:缩放几何图形后错误的 BoundingBox

    在我的场景中 我有一个简单的立方体 var test new THREE Mesh new THREE CubeGeometry 10 10 10 new THREE MeshBasicMaterial scene add test 该立方
  • 在新的 Google 协作平台 <嵌入 HTML> 中使用 localStorage 和 IndexedDB 不起作用

    我正在尝试将新的 Google 协作平台用于我开发的网页 但是 我在存储本地数据时遇到了问题 本地文件在 Windows 和 Apple safari chrome 中运行良好 从 Google 协作平台尝试一下 没有什么乐趣 此外 在 s
  • 如何将内联 JavaScript 与 Express/Node.js 中动态生成的内容分开?

    对于具有几年 Web 开发经验但没有找到答案的人来说 这是一个有点菜鸟的问题程序员堆栈交换 or Google 我决定在这里问一下 我在用Express网络框架Node js 但这个问题并不特定于任何 Web 框架或编程语言 以下是从数据库
  • 图像无法在带有 DOM 的 IE 中加载:控制台中的 7009 错误(无法解码)

    当在 IE 中的单个页面上加载许多图像时 在 IE11 中重现 其中一些图像开始加载失败 并在控制台中出现类似以下警告的内容 DOM7009 无法解码 URL 处的图像 某些唯一的 url 当我查看网络流量时 似乎确实从服务器收到了每个图像
  • Draggable JS Bootstrap 模式 - 性能问题

    对于工作中的项目 我们在 JavaScript 中使用 Bootstrap Modal 窗口 我们想让一些窗口可移动 但我们遇到了 JQuery 的性能问题 myModal draggable handle modal header Exa
  • Bootstrap按钮加载+Ajax

    我正在使用 Twitter Bootstrap 的按钮加载状态 http twitter github com bootstrap javascript html buttons http twitter github com bootst
  • 如何纠正流警告:解构(缺少注释)

    我正在编写一个小型 React Native 应用程序 并且正在尝试使用 Flow 但我无法在任何地方真正获得有关它的正确教程 我不断收到错误 destructuring Missing annotation 有关 station 这段代码
  • 设置 cookie 时中断 JavaScript 执行

    当设置 cookie 时 是否可以始终中断浏览器开发人员工具中的 javascript 执行 无需显式设置 JS 断点 document cookie 在 html head 块的开头添加此代码片段效果很好
  • Chrome 扩展程序在代码中使用 client_secret

    我正在开发具有自己的 oAuth 授权的 Google Chrome 扩展 当然 我必须使用 client id 和 client secret 作为请求令牌 有什么办法可以向用户隐藏这些数据吗 由于此请求只是 javascript 源代码
  • 页面上使用 HTML Editor Extender 进行回发会导致 IE11 中出现 JavaScript 错误

    我已将 HTML 编辑器扩展程序添加到我正在处理的页面中 现在每当我在页面上发回帖子时 都会收到以下 Javascript 错误 JavaScript 运行时错误 参数无效 之后什么也没有发生 这在 IE10 或更低版本以及我所知道的所有其
  • 使用 Vue 的多模式组件

    我在 Vue 中实现动态模式组件时遇到问题 A common approach I follow to display a set of data fetched from the db is I dump each of the rows
  • 在 Javascript 中连接空数组

    我正在浏览一些代码 我想知道这有什么用处 grid push concat row 根据我的理解 它等同于 grid push row 为什么要大惊小怪 连接 你想使用 concat当您需要展平数组并且没有由其他数组组成的数组时 例如 va
  • 如何隐藏/禁用 Highcharts.js 中的图例框?

    我想问是否可以使用 HighCharts js 库隐藏图表中的所有图例框 var chart object chart renderTo render to type graph type colors graph colors title
  • 如何确定所有角度2分量都已渲染?

    当所有 Angular2 组件完成渲染时 是否会触发一个角度事件 For jQuery 我们可以用 function 然而 对于 Angular2 当domready事件被触发 html 只包含角度组件标签 每个组件完成渲染后 domrea

随机推荐

  • 当 PostgreSQL 停止时 TFDConnection.Connected 保持 True

    我正在使用 Delphi 10 和 FireDAC 连接到 PostgreSQL 9 5 x64 我的软件中有一个重新连接功能 它依赖于TFDConnection Connected flag if not conn Connected t
  • 为什么对最大池化使用相同的填充?

    在经历的同时Keras 博客中的自动编码器教程 https blog keras io building autoencoders in keras html 我看到作者在卷积自动编码器部分的最大池化层中使用了相同的填充 如下所示 x Ma
  • Visual Studio 不断更改 project.sln 文件

    我在一个 Visual C 项目团队中工作 下列的advice https stackoverflow com questions 3922660 which visual c file types should be committed
  • 合并多个 Excel 工作簿中的列并自动重复数据删除

    我有三个工作簿 其 ID 位于 A 列中 我想创建第四个工作簿 它应该合并 ID 并自动删除重复数据 以便我可以对它们执行 vlookup 以引用其他工作簿上的数据 包含数据的 3 个工作簿将不断更新 添加新的 ID 号 因此我需要主 摘要
  • 可以使用不同的约束子类型来实例化函数

    TypeScript 拒绝编译debounce函数 因为包装函数的类型有问题 export function debounce
  • 至多一次和恰好一次

    我正在研究分布式系统 当涉及到 RPC 部分时 我听说过这两种语义 最多一次和恰好一次 据我所知 当我们不希望重复执行时 最多一次用于数据库实例 第一个问题 这是如何实现的 服务器如何知道它不应该再次执行该请求 它可能是重复的 但也可能是合
  • 如何记录在 servlet 过滤器中调用的托管 bean 名称和操作方法

    我正在开发一个基于 JSF 2 Mojarra 构建的 Web 应用程序 我需要通过 servlet 过滤器记录一些检测信息 为此 我还需要知道正在调用哪个 ManagedBean 以及哪个方法 有没有办法获取这些信息 我无法访问Faces
  • android布局调整父级大小而不调整子级大小

    TLDR 版本 当我调整父级的大小时 解释 在 Android 应用程序中 我有一个父布局 其中有多个相对布局
  • Sklearn - 绘制分类报告给出的输出与基本平均值不同?

    我想利用这个答案如何绘制 scikit learn 分类报告 https stackoverflow com questions 28200786 how to plot scikit learn classification report
  • 是否可以将参数从模型中传递到 before_create ?

    我有一个模型 例如 class Account lt ActiveRecord Base before create build dependencies def build dependencies use nifty params to
  • 类模板中的静态成员变量

    当您有一个包含静态成员的 非模板化 类时 例如 class Foo public static int x Then Foo x必须在一个且仅一个翻译单元中定义 否则编译器会抱怨多个定义 所以在somefile cpp你必须定义它 int
  • JSF/Hibernate NotBlank 验证

    我有一个简单的 JSF RichFaces 表单 其中包含一些字段 显然还有一个用于存储它们的支持 bean 在该 bean 中 所有必要的属性都有验证注释 jsr303 hibernate 但我似乎找不到可以检查属性 字符串 是否为空的注
  • 当readyState = 4时,HTML5视频持续时间无穷大

    我正在创建一个自定义 html5 视频播放器 可以播放直播流 录制直播流和播放常规视频文件 为了录制 我使用 RecordRTC 一切运行良好 但我需要创建一个自定义搜索栏 为此 我只需使用 var seekerPosition video
  • 使用 Maven/JUnit/Spring 在第一次失败时停止测试

    我希望 Maven 在遇到第一个错误时停止尝试运行我的 JUnit Spring 测试 这可能吗 我的测试类如下所示 我将它们作为标准 Maven 目标运行 ContextConfiguration locations classpath
  • Jaybird CallableStatement 在获取输出参数之前不会执行

    我有这个Java code Connection conn connectionProvider getConnection statement conn prepareCall execute procedure rm set coord
  • 使用 IMvxMessenger 获取消息两次

    我正在开发 Xamrin Android 应用程序 并且正在使用 MvvmCross 在我的应用程序中 我使用了 IMvxMessenger 但是当我更改视图并返回到同一视图时 我收到两次消息 然后它就崩溃了 解决办法是什么 这是我的代码
  • Java 强制转换异常(不是类强制转换异常)

    当 java 中捕获异常时 是否有将异常转换为新类型的用例 或者是标准 throw new DiffException e 唯一的办法就是做到这一点 如果我忽略了某些内容 我深表歉意 但我得到的唯一搜索结果是 ClassCastExcept
  • UINavigationBar右键不显示

    我通过通知使用以下函数在 UINavigationBar 上加载右键 即使我可以追踪该按钮并验证它是否已分配 它也不会显示 有什么想法吗 编辑 2011 年 4 月 6 日下午 2 42 所以 一些有趣的事情 宽度总是报告为 0 0 voi
  • JMeter JSON Extractor 按条件获取值

    I get a JSON像这样的字符串 id 123 name XX default false type other id 789 name ZZ default false type first 我想得到id 其中名称是ZZ 所以提取的
  • 将 svelte 应用程序构建为一组静态文件

    我想在我的下一个项目中使用 Svelte 因为它的语法简洁并且使用起来非常愉快 不幸的是 要在我的公司部署该应用程序 我无法使用node或服务器上类似的东西 我只能从以下位置提供应用程序nginx作为静态文件 苗条有可能吗 我找不到任何可以