模板中 定义 异步箭头函数, 并在函数内部将 (其他)异步函数返回值赋值, 出现 'await' is only allowed within async functions and at the top levels of modules.

[lovemilk2333]

Vue version

3.3.4

Link to minimal reproduction

https://play.vuejs.org/#__PROD__eNp9UbtOwzAU/RXLSxIJpQNMJa14qAMMgCijl+Depmkd27Kv26Iq/861Q0uFUCfb51yfh33g99aW2wB8zCsvXWuRecBgp0IrQObAswnLMqGFrv2XlmwZtMTWaKIwOD03HeCq1U1esIPQ7AdOV3qhq9EgSnJ0QOisqhHoxFj1GRBJ506qVm4mgkujvVFQKtPkWQKz4pblyZbUJ1N2GOLUu7qN0f7690VeCD4ddKvRsJJXNToz5lccPVkt26Zce6OpeMod/TvbKnCvNvbzgo+HRpGrlTK754ShC3B1xOUK5OYffO33ERP8jSKD24LgJw5r1wAO9Gz+Anvan8jOLIKi6QvkO9AzhZhxGHsIekGxz+ZS2qfOGof0Mh9+tkfQ/lgqBo2TfZoXnH7/8UL137jX5U26Rz/L+299n758

Steps to reproduce

在模板的元素的回调中 (如 @click) 定义异步箭头函数, 并将变量赋值为 await <任意异步函数> (如 a = await xxx()) 则在 生产环境build 出现 'await' is only allowed within async functions and at the top levels of modules., 但 开发环境 正常可编译通过, 且 VSCode 语法检查没有问题

What is expected?

开发环境与生产环境行为相同, 均可顺利通过 build

What is actually happening?

SyntaxError: Error parsing JavaScript expression: 'await' is only allowed within async functions and at the top levels of modules. (1:1)

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (20) x64 Intel(R) Core(TM) i9-10900 CPU @ 2.80GHz
    Memory: 15.30 GB / 31.74 GB
  Binaries:
    Node: 18.20.1 - ~\AppData\Local\Volta\tools\image\node\18.20.1\node.EXE
    Yarn: 4.1.1 - ~\AppData\Local\Volta\tools\image\yarn\4.1.1\bin\yarn.CMD
    npm: 10.5.0 - ~\AppData\Local\Volta\tools\image\node\18.20.1\npm.CMD
  Browsers:
    Edge: Chromium (123.0.2420.97)
    Internet Explorer: 11.0.22621.1
  npmPackages:
    vue: ^3.3.4 => 3.4.21

Any additional comments?

nope

[Joan1590]

I fix your code:

<script setup>
let res = ''

async function returnSomething() {
  console.log("Hello :D");
  return ''
}
</script>

<template>
  <button @click="async ()=>{console.log('click'); await returnSomething()}">button</button>
</template>

you have a syntax error, it's a javascript error, no for vue!

[so1ve]

Vue allows doing so:

Prod:

https://play.vuejs.org/#__PROD__eNp9UU1vAiEU/CuEi5oYPbQns5p+xEN7aJvaI5ctPhVlgcBDbcz+9z6ga03TuJeFmWFmHpz4vXOjfQQ+4VWQXjlkATC6mTAakHkIbMp6PWGEqcOXkWwVjURlDVEYvVnYBnCjzLo/YCdh2A+cj7TCVONiSna0QWicrhFox1j1GRHJ505qJXdTwRPIWD/HkNt0VgzTV2rUh1qlSn9zi6od9AdpJfisOFfj8qe0anwRzYccg7RmpdajbbCGRs9BgkvbOKXBv7o0YRB80lUQvNbaHp4zhj7CsMPlBuTuH3wbjgkT/I3Kg9+D4GcOa78GLPR88QJHWp/Jxi6jJvUV8h2C1TF1LLKHaJZU+0KX2z41znqkO/oI8yOCCd1QqWhStlkvOL3/45XRf+vejG7zOXpb3n4Dbp28QQ==

Dev:

https://play.vuejs.org/#eNp9UU1vAiEU/CuEi5oYPbQns5p+xEN7aJvaI5ctPhVlgcBDbcz+9z6ga03TuJeFmWFmHpz4vXOjfQQ+4VWQXjlkATC6mTAakHkIbMp6PWGEqcOXkWwVjURlDVEYvVnYBnCjzLo/YCdh2A+cj7TCVONiSna0QWicrhFox1j1GRHJ505qJXdTwRPIWD/HkNt0VgzTV2rUh1qlSn9zi6od9AdpJfisOFfj8qe0anwRzYccg7RmpdajbbCGRs9BgkvbOKXBv7o0YRB80lUQvNbaHp4zhj7CsMPlBuTuH3wbjgkT/I3Kg9+D4GcOa78GLPR88QJHWp/Jxi6jJvUV8h2C1TF1LLKHaJZU+0KX2z41znqkO/oI8yOCCd1QqWhStlkvOL3/45XRf+vejG7zOXpb3n4Dbp28QQ==