sveltekit cannot be run with nx commands

[DannyvanHolten]

Current Behavior

When using Nx it is currently not possible to run sveltekit with the normal build commands. We have a workaround for this by adding the following configuration to our application:

"build-with-vite": {
      "executor": "@nx/vite:build",
      "outputs": ["{options.outputPath}"],
      "options": {
        "outputPath": "dist/apps/my-app",
        "tsConfig": "apps/my-app/tsconfig.app.json",
        "assets": ["apps/my-app/*.md"]
      }
    },
    "build": {
      "executor": "nx:run-commands",
      "options": {
        "cwd": "apps/my-app",
        "commands": ["pnpm install && pnpm run build"],
        "parallel": false
      }
    },

However, this setup breaks several things like the nx dependency tree.

Expected Behavior

I would like to be able to run the nx commands when using sveltekit.

This problem is also already described a topic within the sveltekit repository, but as you can see. Sveltekit redirects the questions for this support to the monorepo tooling.

sveltejs/kit#12499

GitHub Repo

No response

Steps to Reproduce

See: sveltejs/kit#12499

Nx Report

NX   Report complete - copy this into the issue template

Node           : 22.11.0
OS             : darwin-arm64
Native Target  : aarch64-macos
pnpm           : 9.12.3

nx (global)        : 20.0.6
nx                 : 20.0.12
@nx/js             : 20.0.12
@nx/jest           : 20.0.12
@nx/eslint         : 20.0.12
@nx/cypress        : 20.0.12
@nx/devkit         : 20.0.12
@nx/eslint-plugin  : 20.0.12
@nx/node           : 20.0.12
@nx/plugin         : 20.0.12
@nx/rollup         : 20.0.12
@nx/storybook      : 20.0.12
@nx/vite           : 20.0.12
@nx/web            : 20.0.12
typescript         : 5.6.3
---------------------------------------
Registered Plugins:
@nx/eslint/plugin
@nx/vite/plugin
@nx/storybook/plugin
@nx/cypress/plugin
---------------------------------------
Local workspace plugins:
         @my-prefix/generators

Failure Logs

Package Manager Version

No response

Operating System

• macOS
• Linux
• Windows
• Other (Please specify)

Additional Information

See: sveltejs/kit#12499

[SmoshySmosh]

I investigated this issue a while ago and can provide some insights. As you pointed out, Nx and SvelteKit both assume they will be executed from the root of the repository, which creates a conflict. Nx, as a monorepo management tool, appropriately requires execution from the root since it coordinates projects across the entire workspace. SvelteKit, however, operates as a single-project framework and should ideally support being run from any directory, but currently, it enforces being run from the root as well.

With this understanding, I reverse-engineered SvelteKit's behavior and developed a simple workaround that maintains Nx's full functionality while allowing SvelteKit to operate. However, this solution is a hack and depends on the current implementations of Nx and SvelteKit. Future changes in either tool could render it ineffective, which is why I ultimately decided to avoid using SvelteKit in my project.

If you'd like to try the workaround, the implementation is as follows:

import { defineConfig } from 'vite';
import sveltekit from '@sveltejs/kit/vite';

const sveltekitFix = async () => {
    const cwd = process.cwd();
    process.chdir(__dirname); // Temporarily change the working directory
    const plugin = await sveltekit(); // Load the SvelteKit plugin
    process.chdir(cwd); // Restore the original working directory
    return plugin;
};

export default defineConfig({
        ...
    plugins: [
        svelteKitPlugin(), // Include the SvelteKit plugin with the workaround
        ...
    ],
    ...
});

I hope this solution proves helpful for your setup. Best of luck with your project!