如何无需完整重新构建即可执行SvelteKit预渲染？

一、搞定monaco-editor的打包臃肿问题 #

monaco-editor体积大是构建慢的核心原因，而且预渲染阶段根本不需要它（预渲染是生成静态HTML，monaco是客户端交互组件），所以重点是让预渲染流程完全跳过它：

• 动态导入+客户端判断：在组件里只在浏览器环境下加载monaco，预渲染时不会打包这部分代码：

  <script>
    import { browser } from '$app/environment';
    let monacoInstance;
  
    if (browser) {
      // 动态导入，预渲染阶段忽略
      import('monaco-editor').then((module) => {
        monacoInstance = module;
        // 这里写你的monaco初始化逻辑
      });
    }
  </script>
  

• 改用CDN加载：直接在app.html里引入CDN的monaco脚本，彻底跳过本地打包这个大文件：

  <!-- 在app.html的<head>中添加 -->
  <script src="https://cdn.jsdelivr.net/npm/monaco-editor@latest/min/vs/loader.js"></script>
  

  之后在组件里通过全局的require来初始化monaco，完全不用在项目里安装monaco依赖，构建速度直接起飞。

• 按需导入核心功能：如果必须本地安装，别导入整个包，只挑你需要的部分，比如只导入编辑器核心和JavaScript语言支持：

  import * as monaco from 'monaco-editor/esm/vs/editor/editor.api';
  import 'monaco-editor/esm/vs/basic-languages/javascript/javascript.contribution';
  

  这样能砍掉大部分没用的语言包和插件，缩小打包体积。

二、优化预渲染流程，减少重复劳动 #

你要的是仅预渲染，而且数据库更新后不想全量重建，这部分可以从配置和增量构建入手：

• 配置SvelteKit专注预渲染：在svelte.config.js里关闭SSR和不必要的客户端渲染，指定预渲染路由：

  import adapter from '@sveltejs/adapter-static';
  
  export default {
    kit: {
      adapter: adapter({
        pages: 'build',
        assets: 'build'
      }),
      prerender: {
        entries: ['*'], // 或者列出你需要预渲染的具体路由
        handleHttpError: 'warn'
      },
      ssr: false, // 不需要SSR就关掉，减少构建内容
      csr: false // 如果所有内容都是静态预渲染的，客户端渲染也可以关
    }
  };
  

  这样构建时只会处理预渲染的静态页面，不会生成多余的服务端或客户端代码。

• 增量预渲染，只更改变动页面：数据库更新后，别全量构建，只渲染受影响的页面。可以用SvelteKit的预渲染命令指定路由：

  node node_modules/@sveltejs/kit/src/commands/prerender.js --routes "/article/123"
  

  你可以写个脚本，先从数据库里查出更新的内容对应的路由，然后批量执行这个命令，只重新生成变化的页面，节省大量时间。

• 缓存预渲染结果：给每个预渲染页面生成一个哈希值（比如基于数据库内容的MD5），构建时先对比哈希，只有哈希变化的页面才重新渲染，其余直接用缓存的HTML文件。

三、其他小技巧 #

• 调整Vite构建配置：在vite.config.js里开启更快的压缩方式，比如用esbuild代替默认的terser（速度快很多）：

  export default {
    build: {
      minify: 'esbuild'
    }
  };
  

• 分离静态与交互代码：把预渲染的静态HTML和客户端交互逻辑（比如monaco）完全分开，静态部分预渲染，交互部分单独打包成小的JS文件，预渲染时不用处理交互代码。

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