Next.js从JS迁移到TypeScript+SCSS时出现模块找不到及构建失败问题求助

我正在把一个Next.js应用从.js迁移到.ts，同时使用SCSS，结果运行npm run dev时就碰到了第一个错误。另外运行npm run build时还出现了一些和SCSS无关的问题，看起来可能是更宽泛的配置问题，真心希望能得到大家的建议！

我的迁移步骤如下：

• 执行 touch tsconfig.json 创建TypeScript配置文件
• 运行 npm run dev
• 执行 npm install --save-dev typescript @types/react @types/node 安装TypeScript相关依赖
• 再次运行 npm run dev

一、npm run dev 时出现的错误 #

首先遇到了Watchpack的初始扫描错误：

Watchpack Error (initial scan): Error: ENOTDIR: not a directory, scandir '/Users/Edward.Martin/Desktop/Edward/projects/coinGift/node_modules/next/dist/compiled/util/util.js'

紧接着是模块找不到的错误：

error - ./src/pages/_app.js:2:0
Module not found: Can't resolve 'styles/global.scss'
1 | import React from "react";

2 | import "styles/global.scss";
3 | import "styles/components/index.scss";
4 | import NavbarCustom from "components/NavbarCustom";
5 | import Footer from "components/Footer";

二、npm run build 时出现的错误 #

构建直接失败，报错信息如下：

Failed to compile.
./src/pages/_app.js
Module not found: Can't resolve 'styles/global.scss' in '/Users/Edward.Martin/Desktop/Edward/projects/coinGift/src/pages'
./src/pages/_app.js
Module not found: Can't resolve 'styles/components/index.scss' in '/Users/Edward.Martin/Desktop/Edward/projects/coinGift/src/pages'
./src/pages/_app.js
Module not found: Can't resolve 'components/NavbarCustom' in '/Users/Edward.Martin/Desktop/Edward/projects/coinGift/src/pages'
./src/pages/_app.js
Module not found: Can't resolve 'components/Footer' in '/Users/Edward.Martin/Desktop/Edward/projects/coinGift/src/pages'
./src/pages/_app.js
Module not found: Can't resolve 'util/analytics' in '/Users/Edward.Martin/Desktop/Edward/projects/coinGift/src/pages'

Build failed because of webpack errors

三、已尝试但无效的解决方案 #

• 添加SCSS类型声明文件
  很多文章提到要在next-env.d.ts里添加模块定义，但这个文件会被Next.js自动覆盖（而且文件里明确注释了// NOTE: This file should not be edited，说明这已经不是正确的解决方式了）。于是我在项目根目录创建了index.d.ts，内容如下：

  declare module "*.module.css";
  declare module "*.module.scss";
  declare module "*.scss" {
    const content: { [key: string]: any };
    export = content;
  }
  

  同时也把"index.d.ts"添加到了tsconfig.json的include字段数组中，但问题并没有解决。

• 安装额外的样式加载器依赖
  尝试安装了style-loader、css-loader，但依旧无法解决问题。

备注：内容来源于stack exchange，提问作者sudo install