Illustration of issues around use of top-level await in Vite apps

Overview

vite-top-level-await-repro

Illustration of issues around use of top-level await in Vite apps: https://github.com/vitejs/vite/issues/5013

Top-level await doesn't work in SSR

Try node run.js. The expectation is that it will load src/index.js (which depends on src/data.js, which includes a top-level await) and run its exported list_fruits function.

Instead, we get an error:

3:45:57 PM [vite] Error when evaluating SSR module src/index.js:
SyntaxError: Cannot use keyword 'await' outside an async function (2:0)
    at Object.pp$5.raise (/path/to/vite-top-level-await-repro/node_modules/vite/dist/node/chunks/dep-36bf480c.js:47485:13)

This means that apps that use Vite for server-side rendering cannot make use of top-level await.

esbuild options are apparently ignored

This one is probably just PEBKAC, but: I would expect npx vite build to build the app successfully, despite the top-level await failing ESBuild's default safari13.1 target check, because the Vite config specifies esbuild: false. For whatever reason, it's not having any effect.

I encountered this while trying to figure out if there's any magic that Vite performs (or could perform) to transpile top-level awaits for environments where it's not natively supported (of which Safari 14 and below is the only one I particularly care about).

You might also like...

Jsynchronous.js - Data synchronization for games and real-time web apps.

Jsynchronous.js Synchronize your rapidly changing app state with all connected browsers. Jsynchronous ensures all clients see the same data as what’s

Dec 16, 2022

Thin Backend is a Blazing Fast, Universal Web App Backend for Making Realtime Single Page Apps

Thin Backend is a Blazing Fast, Universal Web App Backend for Making Realtime Single Page Apps

Website | Documentation About Thin Thin Backend is a blazing fast, universal web app backend for making realtime single page apps. Instead of manually

Dec 25, 2022

An easy-to-use multi SQL dialect ORM tool for Node.js

Sequelize Sequelize is a promise-based Node.js ORM tool for Postgres, MySQL, MariaDB, SQLite and Microsoft SQL Server. It features solid transaction s

Jan 4, 2023

A query builder for PostgreSQL, MySQL and SQLite3, designed to be flexible, portable, and fun to use.

knex.js A SQL query builder that is flexible, portable, and fun to use! A batteries-included, multi-dialect (MSSQL, MySQL, PostgreSQL, SQLite3, Oracle

Jan 4, 2023

Workshop to illustrate how to use GraphQL

Workshop to illustrate how to use GraphQL

🎓 Netflix Clone using Astra DB and GraphQL 50 minutes, Intermediate, Start Building A simple ReactJS Netflix homepage clone running on Astra DB that

Jan 4, 2023

A proposal to add modern, easy to use binary encoders to the web platform.

proposal-binary-encoding A proposal to add modern, easy to use binary encoders to the web platform. This is proposed as an addition to the HTML spec,

Nov 27, 2022

This API can be use to all developers to get location details of Sri Lanka 🇱🇰 including major cities, sub areas, districts and Provinces. ⛳️

This API can be use to all developers to get location details of Sri Lanka  🇱🇰 including major cities, sub areas, districts and Provinces. ⛳️

Location Data API - Sri Lanka Table of Contents Introduction Technologies Implemantations Hosting Use Cases Getting Started Project Setup Contributing

Jun 29, 2022

An easy-to-use discord bot including database, slash commands and context menus !

Discord Bot Template An easy-to-use discord bot using Discord.JS V13. Wiki Includes: Slash commands Database User commands and more in future Requirem

Dec 28, 2022

NodeDomainScrape - Use puppeteer to catch the data from domain.com.au

nodeDomainScrape 1 install node (https://nodejs.org/en/) and download the code; 2 run npm install in the terminal; 3 go to "https://www.domain.com.au/

Jan 2, 2022
Owner
Rich Harris
Rich Harris
Share an abstract-level database over the network or other kind of stream.

many-level Share an abstract-level database over the network or other kind of stream. The successor to multileveldown. If you are upgrading, please se

Level 15 Mar 27, 2022
Lovefield is a relational database for web apps. Written in JavaScript, works cross-browser. Provides SQL-like APIs that are fast, safe, and easy to use.

Lovefield Lovefield is a relational database written in pure JavaScript. It provides SQL-like syntax and works cross-browser (currently supporting Chr

Google 6.8k Jan 3, 2023
ConnectNOW - Live web application that allows you to connect with people around the world!

connectNOW Live web application that allows you to connect with people around the world! You can share images, quotes, and anything on your mind! It a

Isha Chaudhry 1 Jan 3, 2022
around nestjs, with prisma and some graphql lib,write less code,create power api

介绍 这是一个 prisma + nestjs + graphql 的集成示例 对于开发者来说,特别是使用 graphql 的时候,只需要写非常少量的代码即可完成数据的各种操作,同时也支持接口透传。 开发&部署 本地开发 npm run start:dev swagger 地址:http://loc

芋头 26 Nov 24, 2022
A simple Node.js ORM for PostgreSQL, MySQL and SQLite3 built on top of Knex.js

bookshelf.js Bookshelf is a JavaScript ORM for Node.js, built on the Knex SQL query builder. It features both Promise-based and traditional callback i

Bookshelf.js 6.3k Jan 2, 2023
A MongoDB-like database built on top of Hyperbee with support for indexing

hyperbeedeebee A MongoDB-like database built on top of Hyperbee with support for indexing WIP: There may be breaking changes in the indexing before th

null 35 Dec 12, 2022
Plant trees to harvest apples. Sell apples to buy upgrades. Sell apples and wares to make the most money and top the leaderboard!

Happy Harvesters Apple Orchard Game A browser based game that is also mobile friendly so you can finally say "How about THEM apples". Table of Content

Scott Rohrig 7 May 21, 2022
🍉 Reactive & asynchronous database for powerful React and React Native apps ⚡️

A reactive database framework Build powerful React and React Native apps that scale from hundreds to tens of thousands of records and remain fast ⚡️ W

Nozbe 8.8k Jan 5, 2023
🍹 MongoDB ODM for Node.js apps based on Redux

Lightweight and flexible MongoDB ODM for Node.js apps based on Redux. Features Flexible Mongorito is based on Redux, which opens the doors for customi

Vadim Demedes 1.4k Nov 30, 2022
A beautiful error page for PHP apps

DO NOT USE YET, THIS PACKAGE IS IN DEVELOPMENT Ignition: a beautiful error page for PHP apps Ignition is a beautiful and customizable error page for P

Spatie 237 Dec 30, 2022