nuxt.js项目替换成next.js遇到的一些小问题

由于Nuxt是一个基于Vue的通用应用框架，而Next是一个React框架，允许使用React构建SSR和静态web应用，所以先装好next.js基本环境：

前面安装步骤和网上大部分说法一致，

$ npm install --save react react-dom next @types/react

package.json像这样添加两个脚本

"scripts": {
    "dev:next": "next",
    "build:next": "next build",
    ...
}

在根目录下新建文件夹和文件：pages/index.ts(.js)和static/

此时运行 npm run build:next，成功后会再根目录生成一个文件夹.next，然后运行命令：npm run dev:next，此时收到报错⬇️

ReactFreshWebpackPlugin does not support webpack vNaN.

跟着报错信息，找到@next/react-refresh-utils/ReactRefreshWebpackPlugin.js

很明显其实就是没有webpack这个依赖，此时把webpack装上

npm i webpack --save-dev

刚开始我没有指定webpack版本，所以装的直接是5.X的版本，此时再运行：npm run dev:next ， 收到下一个报错😅

我又找到@next对应的文件下，找到这一段代码

既然webpack5不行，我们就换个版本，用4.x

再运行 命令 npm run dev:next，终于跑起来啦，大功告成！

我是个前端小辣鸡，有不对的或漏掉的请多补充、请多指教【笔芯】