Hacktoberfest 2026：メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

vite-plugin: SSR function import path is wrong when Vite root is a subdirectory (relative build.outDir resolved against cwd)

オープン 初心者向け
  • 何か問題がありますか？
#68 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

難易度
2/5
見積もり時間
1〜3時間
初心者へのやさしさ
78/100
issue の種類
バグ
明瞭さ
明確に書かれている
活発さ
活発
技術スタック
typescript, vite
領域
build-system

調査の方向性

build.outDir 環境を使用する writeBundle ロジックの周辺にある dist/main.js から始め、次にリポジトリのルートから pnpm run build を実行して、報告された再現手順を確認します。完了条件は、web/.netlify/v1/functions/server.mjs が正しい相対インポートを使用し、Netlify Functions のバンドリングがサブディレクトリの Vite root に対して server.js を解決することです。

索引モデルが issue の本文から書いたものです。

説明

Environment

  • @netlify/vite-plugin-tanstack-start 1.3.19 (bundles @netlify/vite-plugin 3.0.1)
  • @tanstack/react-start 1.168.54
  • vite 8.3.0
  • Node 24, pnpm

Summary

When the Vite root is a subdirectory of the repository and the build runs from the repository root, the generated SSR function gets an extra ../ in its import specifier.

# web/.netlify/v1/functions/server.mjs (generated)
import serverEntrypoint from "../../../../dist/server/server.js";

# expected
import serverEntrypoint from "../../../dist/server/server.js";

Netlify's Functions bundling then fails:

◈ Functions bundling
◈ Packaging Functions from web/.netlify/v1/functions directory:
 - server.mjs
X [ERROR] Could not resolve "../../../../dist/server/server.js"
    web/.netlify/v1/functions/server.mjs:1:29

This makes the SSR/API function undeployable for this layout. The same wrong specifier is produced regardless of whether the directory is discovered as a framework function (<base>/<package>/.netlify/v1/functions) or via [functions] directory.

How to reproduce

Repo layout where Vite root is a subdirectory but the build is invoked from the repo root:

repo/
├─ netlify.toml           # [build] command = "pnpm run build"
├─ package.json           # "build": "vite build --config web/vite.config.ts"
└─ web/
   ├─ vite.config.ts      # root: <web/>
   └─ src/...

web/vite.config.ts:

export default defineConfig({
  root: rootDir, // web/
  plugins: [tanstackStart(), netlify(), react()],
});

Then:

pnpm run build           # from repo root, process.cwd() !== config.root
cat web/.netlify/v1/functions/server.mjs

Cause

@netlify/vite-plugin dist/main.js (build plugin):

async writeBundle(_, bundle) {
  const functionsDirectory = join(resolvedConfig.root, NETLIFY_FUNCTIONS_DIR);
  const serverEntrypoint = getServerEntrypoint(bundle, this.environment.config.build.outDir);
  const serverEntrypointRelativePath = toPosixPath(relative(functionsDirectory, serverEntrypoint));
  // ...
}

this.environment.config.build.outDir is a relative value here (dist/server): TanStack Start's plugin derives the per-environment output directory as join(userConfig.build?.outDir ?? 'dist', 'server') (@tanstack/start-plugin-core vite/output-directory.ts), so the environment config keeps it relative.

path.relative(from, to) resolves a relative to against process.cwd(). When process.cwd() !== config.root, the entry path resolves to <repo>/dist/server/server.js instead of <repo>/web/dist/server/server.js, producing one extra ../.

In a project where cwd === root this happens to work, which is why it only shows up with a subdirectory root.

Suggested fix

Resolve the output directory against the Vite root before computing the relative path:

const outDir = isAbsolute(this.environment.config.build.outDir)
  ? this.environment.config.build.outDir
  : resolve(resolvedConfig.root, this.environment.config.build.outDir);
const serverEntrypoint = getServerEntrypoint(bundle, outDir);

Workaround

Setting an absolute build.outDir in vite.config.ts avoids the issue:

build: { outDir: path.join(rootDir, "dist") }

but it would be good not to require that.

主要言語
TypeScript
スター
1
フォーク
4
30日以内にマージされた PR はありません

環境構築

このプロジェクトには開発コンテナ、Dockerfile、コントリビューションガイドがありません。まず README を読み、一般的な手順ははじめてのコントリビューションガイドを参照してください。

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

netlify/framework-adapters のほかの issue

netlify/framework-adapters の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。