我试图通过<Link href="/register">Register</Link>导航到我的注册页面，但当我单击它时，我收到一个错误/警告，内容如下：

• NextJS无法加载我的脚本：
  

或

• 快速重新加载必须执行完全重新加载
  

在这两种情况下，我在终端中得到相同的消息：

这是我的注册页面组件：

import type { NextPage } from "next/types";
import type { FormEvent } from "react";
import { useRef } from "react";
import { createUser } from "../../helpers/helperFuncs";
import styles from "./styles.module.scss";

const Register: NextPage = (): JSX.Element => {
  const emailInputRef = useRef<HTMLInputElement | null>(null);
  const passwordInputRef = useRef<HTMLInputElement | null>(null);

  const submitHandler = async (event: FormEvent<HTMLFormElement>) => {
    event.preventDefault();
    const enteredEmail = emailInputRef.current?.value ?? "";
    const enteredPassword = passwordInputRef.current?.value ?? "";

    // create a new user
    try {
      const createdUser = await createUser(enteredEmail, enteredPassword);
      console.log("createdUser", createdUser);
    } catch (err) {
      console.log("err", err);
    }
  };

  return (
    <div className={styles.auth}>
      <h1>{"Sign Up"}</h1>
      <form onSubmit={submitHandler}>
        <div className={styles.control}>
          <label htmlFor="email">Your Email</label>
          <input type="email" id="email" required ref={emailInputRef} />
        </div>

        <div className={styles.control}>
          <label htmlFor="password">Your Password</label>
          <input
            type="password"
            id="password"
            required
            ref={passwordInputRef}
          />
        </div>
        <div className={styles.actions}>
          <button>{"Create Account"}</button>
        </div>
      </form>
    </div>
  );
};

export default Register;

我要导入的createUser函数：

async function createUser(email: string, password: string) {
  const response = await fetch("/api/auth/register", {
    method: "POST",
    body: JSON.stringify({ email, password }),
    headers: {
      "Content-Type": "application/json",
    },
  });

  const data = await response.json();
  if (!response.ok) {
    throw new Error(data.message || "Something went wrong");
  }
  return data;
}

export { createUser };

我不明白为什么NextJS会强制完全重载，因为我没有使用类组件，而且我不认为我在React渲染树之外编辑任何东西。
加载脚本失败的错误信息也是我无法理解的，但我认为这与webpack的怪异有关，因为它要求一个.js文件，而这也是终端信息所暗示的。我被难住了。任何帮助都将非常感激。

**Edit 1：**我已经发现是className={styles.<whatever>}的使用导致了这些错误和强制重载。但是问题仍然存在--那么我如何以正确的方式使用我的styles.module.scss呢？