升级至Svelte 4后，svelte/register的替代方案是什么？

svelte/register 是 Node.js 环境里用来动态编译 Svelte 组件的 require 钩子，在 Svelte 4 里已经被移除了，下面是几种靠谱的替代方案：

1. 预编译组件（首推） #

把所有 .svelte 文件提前编译成 JavaScript 模块，直接在 Node.js 里引入编译好的文件就行。可以用这些工具实现：

• 用 vite 搭配 @sveltejs/vite-plugin-svelte 配置构建脚本，把组件编译成适合 Node 环境的产物
• 用 svelte/compiler 写个自定义编译脚本，批量处理组件文件：

const { compile } = require('svelte/compiler');
const fs = require('fs');
const path = require('path');

const compileComponent = (filePath) => {
  const source = fs.readFileSync(filePath, 'utf8');
  const result = compile(source, {
    generate: 'ssr', // 服务端渲染用ssr，客户端用dom
    format: 'cjs' // Node.js 环境选CommonJS格式
  });
  const outputPath = path.join(path.dirname(filePath), `${path.basename(filePath, '.svelte')}.js`);
  fs.writeFileSync(outputPath, result.js.code);
};

// 调用这个函数编译目标组件
compileComponent('./src/MyComponent.svelte');

2. 用 svelte/compiler 手动动态编译 #

如果必须保留运行时动态编译的能力，可以直接在代码里用 svelte/compiler 编译组件：

const { compile } = require('svelte/compiler');
const fs = require('fs');

// 读取组件源码
const componentSource = fs.readFileSync('./src/MyComponent.svelte', 'utf8');

// 编译组件（这里以服务端渲染为例）
const { js } = compile(componentSource, {
  generate: 'ssr',
  format: 'cjs'
});

// 执行编译后的代码，拿到组件
const module = { exports: {} };
eval(js.code);
const MyComponent = module.exports.default;

// 比如服务端渲染时生成HTML
const html = MyComponent.render({ /* 传入组件props */ });

3. 自定义 require 钩子（不推荐长期用） #

可以自己写 Node.js 的 require.extensions 钩子（注意：require.extensions 已经被 Node.js 标记为废弃，但暂时还能用）：

const { compile } = require('svelte/compiler');
const fs = require('fs');

require.extensions['.svelte'] = function(module, filename) {
  const source = fs.readFileSync(filename, 'utf8');
  const result = compile(source, {
    generate: 'ssr',
    format: 'cjs'
  });
  module._compile(result.js.code, filename);
};

// 现在可以直接require .svelte文件了
const MyComponent = require('./src/MyComponent.svelte').default;

这种自定义钩子的方式不被 Node.js 官方推荐，长期来看还是预编译方案更稳定可靠。

内容的提问来源于stack exchange，提问作者Kokizzu