S
SolidJS•2mo ago
jalelegenda

"use server" confusion

i have this action in a src/routes/tables.tsx file. 
const schedule_action = action(async (data) => {
  "use server";
  schedule(data.tableId, data.date, data.time);
  console.log("we doin it");
}, "schedule-action");
const schedule_action = action(async (data) => {
  "use server";
  schedule(data.tableId, data.date, data.time);
  console.log("we doin it");
}, "schedule-action");
the schedule function just inserts a new row into sqlite. this will work just fine in this file where the component that has the <form> which consumes it lives. however, if i move this to eg src/server/tables/actions.ts like: 
"use server";

import { action } from "@solidjs/router";
import { schedule } from "~/lib/database";

export const schedule_action = action(async (data) => {
  schedule(data.tableId, data.date, data.time);
}, "schedule-action");
"use server";

import { action } from "@solidjs/router";
import { schedule } from "~/lib/database";

export const schedule_action = action(async (data) => {
  schedule(data.tableId, data.date, data.time);
}, "schedule-action");
and import the file from there, vite complains Module "fs" has been externalized for browser compatibility. Cannot access "fs.access" in client code. etc and my app does not work as expected (doesn't react to clicks). So I'm wondering how does "use server" exactly work and what are the caveats? why does it not behave as expected in my case?
2 Replies
Madaxen86
Madaxen86•2mo ago
the action itself can’t be used with toplevel "use server" as it needs to run on the client. Only the function wrapped by action/query can be "use server".
jalelegenda
jalelegendaOP•2mo ago
thank you for clarifying

Did you find this page helpful?