question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

async script setup support (Top-level 'await')

See original GitHub issue

When checking a component with an async script setup like:

<script setup lang="ts">
const pendingMessage = await Promise.resolve('Hello');
</script>

then Volar throws:

src/components/HelloWorld.vue:8:24 - error TS1378: Top-level 'await' expressions are only allowed when the 'module' option is set to 'esnext' or 'system', and the 'target' option is set to 'es2017' or higher.

8 const pendingMessage = await Promise.resolve('Hello');

That makes sense, and we can workaround it by updating the target to es2017 but I was wondering if that could be supported out of the box?

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:1
  • Comments:8 (5 by maintainers)

github_iconTop GitHub Comments

2reactions
johnsoncodehkcommented, Nov 10, 2021

@rafasoares try add

  "include": [
    "**/*.ts",
    "**/*.js",
+    "**/*.vue",
  ],
0reactions
johnsoncodehkcommented, Jul 23, 2022

@WTFace It’s only for <script setup> but not for .ts.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Vue <script setup> Top level await causing template not to ...
I'm using the new syntax in Vue 3 and I really like the idea of it, but once I tried to use a...
Read more >
Better support for top-level await in <script setup> · Issue #4960
Currently a top-level await in a <script setup> block causes the template not to render, see this StackOverflow question.
Read more >
Vue: <script setup> top-Level await causes typescript compiler ...
Right. Suspense (the feature to consume an async setup()) is still experimental since the API for using the Suspense component may change, ...
Read more >
<script setup> | Vue.js
Top -level await #. Top-level await can be used inside <script setup> . The resulting code will be compiled as async setup() ...
Read more >
TypeScript's New Top-Level Await - Better Programming
In this article, I want to show you that it is possible to finally use top-level await instead of wrapping it between an...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found