JavaScript - SvelteKit - "ReferenceError: ფაილი არ არის განსაზღვრული"

სწრაფი პრობლემა, რომლის წინაშეც დავდექი ვებ-აპლიკაციის შექმნისას SvelteKit-ის გამოყენებით (და გაფართოების ვიტესით):

ჩემი +page.svelte ფაილის <script> ტეგის შიგნით ვცადე ცარიელი პლაცჰოლდერის File ობიექტის შექმნა შემდეგი გზით:

    let formObject: FormCreationData = {
        fileToUpload: new File([], ''),
        anotherField: "",
        ...
    };

მიუხედავად იმისა, რომ ეს უნდა მუშაობდეს ჩვეულებრივ JS/TS-ში (და Svelte-ში, თუ არ იყენებთ SvelteKit-ს), ახლა გამოჩნდება შემდეგი შეცდომა:

ReferenceError: File is not defined
    at +page.svelte:13:14

რატომ არის ეს ასე?

პასუხი #1

მაპროტე SvelteKit ახორციელებს სერვერზე-გვერდზე შესრულებას (SSR) - კოდი, რომელიც არის +page.svelte ფაილში, უნდა შესრულდეს როგორც კლიენტურ ბრაუზერებში, ასევე Vite სერვერზეც.

File კლასი ხელმისაწვდომია მხოლოდ ბრაუზერებში, ამიტომ ის ვერ დააკმაყოფილებს ამ მოთხოვნას (თქვენ შესაძლოა იცოდეთ, რომ Node.js სთავაზობს fs მოდულს, რათა შესაძლებელი გახდეს ფაილებთან ოპერაციები).

ეს ნიშნავს, რომ ამ პრობლემის გამოსასწორებლად არსებობს ორი გზა:

1. გამორთეთ SSR გამოიყენეთ ცვლადი ssr ფაილში +page.ts/js:

   export const ssr = false;
   

2. უნდა მოიძებნოს გზა, რომ განსაზღვროს File ობიექტი იმ ადგილას, სადაც კოდი სრულდება ბრაუზერში (ეს შესაძლებელია $app/environment მოდულში browser ცვლადის გადამოწმებით, ან ერთ-ერთ მხარდაჭერილ Svelte hook-ის შიგნით, როგორიცაა onMount()).