최상위 레벨에서 "await"를 다음과 같이 사용할 때:
으아악터미널에 "set Experiments.topLevelAwait true"라는 경고가 표시됩니다. "tsconfig.json"에 추가하려고 해도 여전히 작동하지 않습니다. "실험적" 속성이 존재하지 않는다고 나옵니다.
비동기 함수로 래핑할 수 있는데 래핑 기능 없이 설정하고 싶어요.
P粉2629261952023-10-23 11:41:01
이 기사를 작성할 당시 나에게 효과가 있었던 최신 솔루션은 SWC 대신 Babel을 사용하는 것입니다. Next.js는 사용자 정의 SWC 구성을 허용하지 않으므로 允许 파일을 전달할 수 없습니다. topLevelAwait。 swcrc
@babel/plugin-syntax-top-level-await 的 Babel 插件添加到 package.json로 지정됩니다. 예를 들어.
으아아아 package.json 所在项目的根目录中创建 .babelrc 파일.
In .babelrc 中确保包含 next/babel 预设和 topLevelAwait 플러그인.
예를 들어.
으아아아이것은 Next.js 팀이 SWC 구성을 포함하도록 허용하기 전까지 가장 간단한 솔루션이었습니다. 이렇게 하면 SWC가 Babel을 위해 비활성화되므로 SWC의 성능 이점을 얻을 수 없습니다.
P粉5415512302023-10-23 09:43:36
tsconfig.json과 아무 관련이 없습니다. next.config.js에서 설정해야 합니다. next.js의 새 버전은 최상위 수준 대기를 지원하는 webpack5를 사용합니다.
으아악주의
기능적 구성 요소 외부에서 사용해야 합니다.
으아악"페이지" 및 "앱" 디렉터리의 "다음"에도 동일한 설정이 적용됩니다: "^13.1.6" . (이 기능은 next.js 기능이 아닌 webpack5webpack5 기능이기 때문입니다.) 다음 샘플 코드를 사용하여 테스트할 수 있습니다.
실험적이기 때문에 일부 버전에서는 깨질 수 있습니다