我在构建 sveltekit 项目时遇到错误

Question

我正在构建一个 sveltekit 项目。我所做的一件事是创建了一种自定义类型的文件，该文件在构建或运行开发服务器时转换为 *.svelte 文件。默认情况下，sveltekit 包含汇总扩展 rollup-plugin-dynamic-import-variables，它试图解析我的自定义文件（谁知道为什么？）并抛出“意外令牌”错误。我正在尝试将该扩展名配置为忽略我的自定义文件，但到目前为止没有成功。这是我尝试的 svelte.config.js 文件：

// @type {import('@sveltejs/kit').Config}
var config;

import adapter from '@sveltejs/adapter-static';

import dynamicImportVariables from 'rollup-plugin-dynamic-import-variables';

config = {
  kit: {
    // --- hydrate the <div id="svelte"> element in src/app.html
    target: '#svelte',
    adapter: adapter({
      pages: 'build',
      assets: 'build',
      fallback: null
    }),
    vite: {
      plugins: [
        dynamicImportVariables({
          warnOnError: true,
          exclude: '**'
        })
      ]
    }
  }
};

export default config;

老实说，我不会在任何地方使用动态导入，因此我会接受完全禁用扩展作为解决方案。但是任何可以让它忽略我的自定义文件的东西也可以。

Answer 1

更新： SvelteKit 1.0.0 支持routes configuration，它可以从src/routes 目录中排除文件。 config 值是一个函数，它接收文件路径作为参数，并返回true 以将文件用作路由。

例如，以下routes 配置从路由中排除*.starbucks 文件：

// sveltekit.config.js
⋮
const config = {
  kit: {
    ⋮
    routes: filepath => {
      return ![
        // exclude *.starbucks files
        /\.starbucks$/,

        // original default config
        /(?:(?:^_|\/_)|(?:^\.|\/\.)(?!well-known))/,
      ].some(regex => regex.test(filepath))
    },
  },
}

demo

---

原答案：

rollup-plugin-dynamic-import-variables 实际上包含在 Vite 中。配置Vite的插件，设置the build.dynamicImportVarsOptions property:

// svelte.config.js
/** @type {import('@sveltejs/kit').Config} */
const config = {
  kit: {
    // hydrate the <div id="svelte"> element in src/app.html
    target: "#svelte",
    vite: {
      build: {
        dynamicImportVarsOptions: {
          exclude: [/node_modules/, /\.starbucks$/],
        },
      },
    },
  },
}

export default config

但这并不能解决问题...

SvelteKit 处理src/routes/ 下的所有文件，以便它们自动导入到输出应用程序（.svelte-kit/build/app.js）中，这将导致相同的错误。

选项 1：私有模块

您可以将src/routes/*.starbucks 文件设置为private module（文件名中有一个前导下划线）来排除它：

src/routes/_home.starbucks ?
src/routes/_index.starbucks ?
src/routes/index.svelte

选项 2：将文件移到 src/routes 之外

或者，将那些*.starbucks 文件移到src/routes/ 之外（例如，移到src/starbucks/ 或src/lib/）：

src/routes/index.svelte
src/starbucks/home.starbucks ?
src/starbucks/index.starbucks ?
src/lib/home.starbucks ?
src/lib/index.starbucks ?