热模块重新加载不适用于我的 nextjs 应用程序 [英] Hot module reload is not working on my nextjs app

问题描述

我有一个基于 nextjs 的项目.奇怪的是，HMR 在我的项目中无法正常工作.每次我进行更改时，我都必须重新运行该过程.我附上了我的下一个配置和 package.json 的详细信息:

I have a project based on nextjs. Oddly enough, the HMR is not working properly for my project. Every time I make changes I have to re run the process. I have attached details of my next config and package.json:

next.config:

next.config:

const withSass = require("@zeit/next-sass");
const withCSS = require("@zeit/next-css");

module.exports = withCSS(
  withSass({
    webpack(config, options) {
      config.module.rules.push({
        test: /\.(eot|woff|woff2|ttf|svg|png|jpg|gif)$/,
        use: {
          loader: "url-loader",
          options: {
            limit: 100000,
          },
        },
      });

      return config;
    }
  })
);

package.json

package.json

"scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "export": "next export"
  },
  "dependencies": {
    "@zeit/next-css": "^1.0.1",
    "@zeit/next-sass": "^1.0.1",
    "antd": "^3.26.8",
    "chartjs": "^0.3.24",
    "classnames": "^2.2.6",
    "draft-js": "^0.11.4",
    "isomorphic-unfetch": "^3.0.0",
    "moment": "^2.24.0",
    "next": "^9.2.1",
    "node-sass": "^4.13.1",
    "react": "16.12.0",
    "react-dom": "16.12.0",
    "react-helmet": "^5.2.1",
    "react-markdown": "^4.3.1",
    "react-mde": "^8.1.0",
    "react-redux": "^7.2.0",
    "react-select": "^3.0.8",
    "react-slick": "^0.25.2",
    "react-toastify": "^5.5.0",
    "redux": "^4.0.5",
    "redux-devtools-extension": "^2.13.8",
    "redux-thunk": "^2.3.0",
    "showdown": "^1.9.1",
    "slick-carousel": "^1.8.1"
  },
  "devDependencies": {
    "eslint": "^6.8.0",
    "eslint-loader": "^3.0.3",
    "eslint-plugin-react": "^7.18.3",
    "url-loader": "^3.0.0"
  }

我已经尝试删除 node_modules 并重新安装，但似乎没有解决问题.

I have tried removing node_modules and reinstalling again as well, doesnt seem to fix the issue.

以下是我的项目结构

推荐答案

从 @felixmosh 获得帮助.出现问题是因为我的文件夹是 case 与 route case 不匹配.通过将文件夹名称更改为路由名称来修复问题.

Got help from @felixmosh. There was issue because of my folders were case was not matching route case. Fixed the issues by changing folder name to route names.

这篇关于热模块重新加载不适用于我的 nextjs 应用程序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！