NextJS项目运行异常：页面加载慢且无法显示，出现依赖警告

运行NextJS项目时出现页面加载耗时过长、无法正常显示，同时抛出以下警告：

warn  - ./node_modules/typescript/lib/typescript.js Critical
dependency: the request of a dependency is an expression

Import trace for requested module:
./node_modules/typescript/lib/typescript.js

解决方法 #

• 排查不必要的TypeScript库导入：业务代码中不应直接导入typescript包，搜索项目中的import * as ts from 'typescript'或类似语句，删除这类非必要导入——TypeScript仅需作为开发依赖用于代码编译，无需打包进生产代码。
• 配置Webpack排除TypeScript依赖：若确实需要在特定场景下使用typescript库，可在next.config.js中修改Webpack配置，将其标记为外部依赖，避免被打包：

  module.exports = {
    webpack: (config) => {
      config.externals = [...(config.externals || []), 'typescript'];
      return config;
    },
  };
  

• 重置依赖环境：删除node_modules、package-lock.json（或yarn.lock），重新执行npm install或yarn install，修复可能存在的依赖损坏或版本冲突问题。
• 升级相关依赖版本：过时的NextJS或TypeScript版本可能存在兼容性bug，升级至最新稳定版：

  npm install next@latest typescript@latest @types/react@latest
  

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