Troubleshooting

Find answers to questions that have been asked by other developers and might help you too.

My environment variables from .env.local are not being loaded

Make sure you are running the pnpm dev command from the root directory of your project (where the pnpm-workspace.yaml file is located)

supastarter uses the dotenv-cli to load environment variables from a .env.local file. The dotenv-cli is automatically used when running the pnpm dev command from the root directory.

Also make sure that the environment variable you are trying to access in your application is listed in the globalEnv object in the turbo.json file. Only then will turbo make the environment variable available to the runtime.

{
  "globalEnv": {
    "NEXT_PUBLIC_SUPABASE_URL": "https://your-supabase-url.supabase.co"
  }
}

The user object in the context is missing properties

If you are using the user object from the context in your api resolvers and you have added custom properties to the user in your schema.prisma file, you need to make sure that Lucia passes the attributes to the user object in the context.

To do so, you can add the following code to your packages/auth/lib/lucia.ts file:

// ...
export const lucia = new Lucia(adapter, {
  // ...
  getUserAttributes(data) {
    return {
      id: data.id,
      email: data.email,
      emailVerified: data.emailVerified,
      name: data.name ?? data.email,
      role: data.role,
      avatarUrl: data.avatarUrl,
      onboardingComplete: !!data.onboardingComplete,
      // Add your custom properties here
      newProperty: data.newProperty,
    };
  },
  // ...
});

How do I use the debugger in VSCode with supastarter?

To use the debugger in VSCode with supastarter, you need to add a new configuration to your .vscode/launch.json file:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Server DEBUG",
      "runtimeExecutable": "pnpm",
      "runtimeArgs": ["run", "dev"],
      "restart": true,
      "console": "integratedTerminal",
      "cwd": "${workspaceFolder}/apps/web",
      "envFile": "${workspaceFolder}/.env.local"
    }
  ]
}

My Next.js development server is very slow

If you are experiencing slow performance with the Next.js development server, this is a known issue with Next.js 14 with app router using webpack. In combination with larger application the development bundling can be really slow compared to previous versions with the pages router.

The Next.js team is aware of this issue and is working on a fix.

We will update the supastarter template as soon as turbopack is ready to be used.

Also notice that this is not an issue in production, so your application will be fast when deployed.

The changes in the tailwind theme configuration are not being applied