顶层await报错：是否需安装Webpack？配置如何生效？

1. 是否需要显式安装Webpack？ #

不需要。你使用的Next.js（版本13.4.2）内部已经集成了Webpack作为默认打包工具，无需单独在项目中安装Webpack依赖。

2. 如何修改配置解决报错？ #

Next.js不会直接读取根目录的webpack.config.js文件，必须通过它专属的next.config.js来扩展Webpack配置，具体操作如下：

• 若项目中没有next.config.js，在package.json同目录下创建该文件
• 将以下内容写入next.config.js：

/** @type {import('next').NextConfig} */
const nextConfig = {
  webpack: (config) => {
    config.experiments = {
      ...config.experiments,
      topLevelAwait: true,
    };
    return config;
  },
};

module.exports = nextConfig;

• 重启Next.js开发服务器，配置即可生效，对应的top-level-await报错会消失。

内容的提问来源于stack exchange，提问作者Tennis Smith