Next.js应用报错：Module not found: Can't resolve 'graphql' 求修复

问题描述 #

我的Next.js应用昨日运行一切正常，但今日出现如下错误：

error - ./node_modules/@urql/core/dist/ddbb86ae.mjs:1:0
Module not found: Can't resolve 'graphql'

Import trace for requested module:
./node_modules/@urql/core/dist/urql-core.mjs
./node_modules/urql/dist/urql.es.js
./pages/_app.js

已执行git reset --hard命令，但问题仍未解决。

我的_app.js代码如下：

import { StateContext } from "../lib/context";
import { Provider, createClient } from "urql";

const client = createClient({ url: "http://localhost:1337/graphql" });

function MyApp({ Component, pageProps }) {
  return (
    <StateContext>
      <Provider value={client}>
        <Nav />
        <Component {...pageProps} />
      </Provider>
    </StateContext>
  );
}

export default MyApp;

解决方法 #

这个错误的核心是@urql/core依赖graphql包，但你的项目中未安装该依赖（或依赖被意外移除），按以下步骤修复：

• 安装graphql依赖
  打开终端，在项目根目录执行对应命令：

  • npm：

    npm install graphql
    

  • yarn：

    yarn add graphql
    

• 清理缓存并重启服务
  安装完成后，停止当前开发服务，执行清理缓存并重启的命令：

  • npm：

    npm run dev -- --clear-cache
    

  • yarn：

    yarn dev -- --clear-cache
    

• 重新安装所有依赖（可选）
  如果问题仍存在，可删除现有依赖文件后重新安装：

  • npm：

    rm -rf node_modules package-lock.json
    npm install
    

  • yarn：

    rm -rf node_modules yarn.lock
    yarn install
    

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