Netlify

要部署到 Netlify，请使用 adapter-netlify。

¥To deploy to Netlify, use adapter-netlify.

当你使用 adapter-auto 时，此适配器将默认安装，但将其添加到你的项目中允许你指定特定于 Netlify 的选项。

¥This adapter will be installed by default when you use adapter-auto, but adding it to your project allows you to specify Netlify-specific options.

用法(Usage)

¥Usage

使用 npm i -D @sveltejs/adapter-netlify 安装，然后将适配器添加到你的 svelte.config.js：

¥Install with npm i -D @sveltejs/adapter-netlify, then add the adapter to your svelte.config.js:

import import adapteradapter from '@sveltejs/adapter-netlify';

export default {
	
kit: {
    adapter: any;
}kit: {
		// default options are shown
		adapter: anyadapter: import adapteradapter({
			// if true, will create a Netlify Edge Function rather
			// than using standard Node-based functions
			edge: booleanedge: false,

			// if true, will split your app into multiple functions
			// instead of creating a single one for the entire app.
			// if `edge` is true, this option cannot be used
			split: booleansplit: false
		})
	}
};

然后，确保项目根目录中有一个 netlify.toml 文件。这将根据此示例配置根据 build.publish 设置确定在何处写入静态资源：

¥Then, make sure you have a netlify.toml file in the project root. This will determine where to write static assets based on the build.publish settings, as per this sample configuration:

[build]
	command = "npm run build"
	publish = "build"

如果缺少 netlify.toml 文件或 build.publish 值，则将使用默认值 "build"。请注意，如果你已将 Netlify UI 中的发布目录设置为其他内容，那么你也需要在 netlify.toml 中设置它，或者使用默认值 "build"。

¥If the netlify.toml file or the build.publish value is missing, a default value of "build" will be used. Note that if you have set the publish directory in the Netlify UI to something else then you will need to set it in netlify.toml too, or use the default value of "build".

Node 版本(Node version)

¥Node version

新项目将默认使用当前的 Node LTS 版本。但是，如果你正在升级不久前创建的项目，它可能会停留在旧版本上。有关手动指定当前 Node 版本的详细信息，请参阅 Netlify 文档。

¥New projects will use the current Node LTS version by default. However, if you’re upgrading a project you created a while ago it may be stuck on an older version. See the Netlify docs for details on manually specifying a current Node version.

Netlify Edge 函数(Netlify Edge Functions)

¥Netlify Edge Functions

SvelteKit 支持 Netlify Edge 函数。如果你将选项 edge: true 传递给 adapter 函数，服务器端渲染将在部署在靠近站点访问者的基于 Deno 的边缘函数中进行。如果设置为 false（默认值），站点将部署到基于 Node 的 Netlify 函数。

¥SvelteKit supports Netlify Edge Functions. If you pass the option edge: true to the adapter function, server-side rendering will happen in a Deno-based edge function that’s deployed close to the site visitor. If set to false (the default), the site will deploy to Node-based Netlify Functions.

import import adapteradapter from '@sveltejs/adapter-netlify';

export default {
	
kit: {
    adapter: any;
}kit: {
		adapter: anyadapter: import adapteradapter({
			// will create a Netlify Edge Function using Deno-based
			// rather than using standard Node-based functions
			edge: booleanedge: true
		})
	}
};

Netlify 的 SvelteKit 功能替代品(Netlify alternatives to SvelteKit functionality)

¥Netlify alternatives to SvelteKit functionality

你可以使用 SvelteKit 直接提供的功能构建你的应用，而无需依赖任何 Netlify 功能。使用这些功能的 SvelteKit 版本将允许它们在开发模式下使用，使用集成测试进行测试，并与其他适配器一起使用，以防你决定放弃 Netlify。但是，在某些情况下，你可能会发现使用这些功能的 Netlify 版本会很有帮助。一个例子是，如果你正在将已经托管在 Netlify 上的应用迁移到 SvelteKit。

¥You may build your app using functionality provided directly by SvelteKit without relying on any Netlify functionality. Using the SvelteKit versions of these features will allow them to be used in dev mode, tested with integration tests, and to work with other adapters should you ever decide to switch away from Netlify. However, in some scenarios you may find it beneficial to use the Netlify versions of these features. One example would be if you’re migrating an app that’s already hosted on Netlify to SvelteKit.

_headers 和 _redirects(_headers and _redirects)

¥_headers and _redirects

Netlify 特有的 _headers 和 _redirects 文件可用于静态资源响应（如图片），只需将它们放入项目根文件夹即可。

¥The _headers and _redirects files specific to Netlify can be used for static asset responses (like images) by putting them into the project root folder.

重定向规则(Redirect rules)

¥Redirect rules

在编译期间，重定向规则会自动附加到你的 _redirects 文件中。（如果它尚不存在，它将被创建。）这意味着：

¥During compilation, redirect rules are automatically appended to your _redirects file. (If it doesn’t exist yet, it will be created.) That means:

• netlify.toml 中的 [[redirects]] 永远不会匹配，因为 _redirects 有 更高优先级。因此，请始终将规则放在 _redirects 文件 中。

  ¥[[redirects]] in netlify.toml will never match as _redirects has a higher priority. So always put your rules in the _redirects file.

• _redirects 不应该有任何自定义 “全部捕获” 规则，例如 /* /foobar/:splat。否则，由于 Netlify 仅处理 第一个匹配规则，因此自动附加的规则将永远不会应用。

  ¥_redirects shouldn’t have any custom “catch all” rules such as /* /foobar/:splat. Otherwise the automatically appended rule will never be applied as Netlify is only processing the first matching rule.

Netlify 表单(Netlify Forms)

¥Netlify Forms

1. 按照 此处 所述创建 Netlify HTML 表单，例如 /routes/contact/+page.svelte。（不要忘记添加隐藏的 form-name 输入元素！）

   ¥Create your Netlify HTML form as described here, e.g. as /routes/contact/+page.svelte. (Don’t forget to add the hidden form-name input element!)

2. Netlify 的构建机器人在部署时解析你的 HTML 文件，这意味着你的表单必须是 prerendered 作为 HTML。你可以将 export const prerender = true 添加到你的 contact.svelte 以仅预渲染该页面，也可以设置 kit.prerender.force: true 选项以预渲染所有页面。

   ¥Netlify’s build bot parses your HTML files at deploy time, which means your form must be prerendered as HTML. You can either add export const prerender = true to your contact.svelte to prerender just that page or set the kit.prerender.force: true option to prerender all pages.

3. 如果你的 Netlify 表单具有类似 <form netlify ... action="/success"> 的 自定义成功消息，请确保相应的 /routes/success/+page.svelte 存在并已预渲染。

   ¥If your Netlify form has a custom success message like <form netlify ... action="/success"> then ensure the corresponding /routes/success/+page.svelte exists and is prerendered.

Netlify 函数(Netlify Functions)

¥Netlify Functions

使用此适配器，SvelteKit 端点托管为 Netlify 函数。Netlify 函数处理程序具有额外的上下文，包括 Netlify Identity 信息。你可以通过钩子和 +page.server 或 +layout.server 端点内的 event.platform.context 字段访问此上下文。当适配器配置中的 edge 属性为 false 时，这些为 无服务器函数；当适配器配置中的 edge 属性为 true 时，这些为 边缘函数。

¥With this adapter, SvelteKit endpoints are hosted as Netlify Functions. Netlify function handlers have additional context, including Netlify Identity information. You can access this context via the event.platform.context field inside your hooks and +page.server or +layout.server endpoints. These are serverless functions when the edge property is false in the adapter config or edge functions when it is true.

export const const load: (event: any) => Promise<void>load = async (event) => {
	const const context: anycontext = event: anyevent.platform.context;
	var console: Console
The console module provides a simple debugging console that is similar to the
JavaScript console mechanism provided by web browsers.
The module exports two specific components:

A Console class with methods such as console.log(), console.error() and console.warn() that can be used to write to any Node.js stream.
A global console instance configured to write to process.stdout and
process.stderr. The global console can be used without calling require('console').

Warning: The global console object’s methods are neither consistently
synchronous like the browser APIs they resemble, nor are they consistently
asynchronous like all other Node.js streams. See the note on process I/O for
more information.
Example using the global console:
console.log('hello world');
// Prints: hello world, to stdout
console.log('hello %s', 'world');
// Prints: hello world, to stdout
console.error(new Error('Whoops, something bad happened'));
// Prints error message and stack trace to stderr:
//   Error: Whoops, something bad happened
//     at [eval]:5:15
//     at Script.runInThisContext (node:vm:132:18)
//     at Object.runInThisContext (node:vm:309:38)
//     at node:internal/process/execution:77:19
//     at [eval]-wrapper:6:22
//     at evalScript (node:internal/process/execution:76:60)
//     at node:internal/main/eval_string:23:3

const name = 'Will Robinson';
console.warn(`Danger ${name}! Danger!`);
// Prints: Danger Will Robinson! Danger!, to stderr
Example using the Console class:
const out = getStreamSomehow();
const err = getStreamSomehow();
const myConsole = new console.Console(out, err);

myConsole.log('hello world');
// Prints: hello world, to out
myConsole.log('hello %s', 'world');
// Prints: hello world, to out
myConsole.error(new Error('Whoops, something bad happened'));
// Prints: [Error: Whoops, something bad happened], to err

const name = 'Will Robinson';
myConsole.warn(`Danger ${name}! Danger!`);
// Prints: Danger Will Robinson! Danger!, to err
@seesourceconsole.Console.log(message?: any, ...optionalParams: any[]): void (+1 overload)
Prints to stdout with newline. Multiple arguments can be passed, with the
first used as the primary message and all additional used as substitution
values similar to printf(3)
(the arguments are all passed to util.format()).
const count = 5;
console.log('count: %d', count);
// Prints: count: 5, to stdout
console.log('count:', count);
// Prints: count: 5, to stdout
See util.format() for more information.
@sincev0.1.100log(const context: anycontext); // shows up in your functions log in the Netlify app
};

此外，你可以通过为它们创建目录并将配置添加到 netlify.toml 文件中来添加自己的 Netlify 函数。例如：

¥Additionally, you can add your own Netlify functions by creating a directory for them and adding the configuration to your netlify.toml file. For example:

[build]
	command = "npm run build"
	publish = "build"

[functions]
	directory = "functions"

故障排除(Troubleshooting)

¥Troubleshooting

访问文件系统(Accessing the file system)

¥Accessing the file system

你不能在边缘部署中使用 fs。

¥You can’t use fs in edge deployments.

你可以在无服务器部署中使用它，但它不会按预期工作，因为文件不会从你的项目复制到你的部署中。相反，使用 $app/server 中的 read 函数来访问你的文件。read 不在边缘部署内工作（未来可能会发生变化）。

¥You can use it in serverless deployments, but it won’t work as expected, since files are not copied from your project into your deployment. Instead, use the read function from $app/server to access your files. read does not work inside edge deployments (this may change in future).

或者，你可以 prerender 相关路由。

¥Alternatively, you can prerender the routes in question.