热重装无法在Nextjs 8.1应用程序中正常工作

时间:2020-10-18 13:19:56

标签: reactjs next.js

我从事Nextjs 8.1版应用程序的开发已经一年了。当我运行npm run dev命令时,应用程序以开发模式运行。当我更改一段代码并将其保存时,该应用将 重新加载 ,但更改未应用。

这是我的 package.json 文件内容:

{
    "name": "Karan",
    "version": "1.0.0",
    "description": "",
    "main": "index.js",
    "scripts": {
        "dev": "SET NODE_ENV=development && SET PORT=4000 && node server.js",
        "build": "next build",
        "prod-build": "next build",
        "next": "next start",
        "start": "SET NODE_ENV=production && SET PORT=8080 && node server.js"
    },
    "keywords": [],
    "author": "",
    "license": "ISC",
    "dependencies": {
        "@ckeditor/ckeditor5-basic-styles": "^11.1.4",
        "@ckeditor/ckeditor5-build-classic": "^12.4.0",
        "@ckeditor/ckeditor5-font": "^11.2.2",
        "@ckeditor/ckeditor5-paragraph": "^11.0.5",
        "@ckeditor/ckeditor5-react": "^1.1.3",
        "@fullpage/react-fullpage": "^0.1.17",
        "@sentry/browser": "^4.6.6",
        "@svgr/webpack": "^4.3.2",
        "@zeit/next-css": "^1.0.1",
        "@zeit/next-stylus": "^1.0.1",
        "axios": "^0.18.1",
        "cleave.js": "^1.5.10",
        "express": "^4.17.1",
        "global": "^4.4.0",
        "jalaali-js": "^1.1.0",
        "leaflet": "^1.5.1",
        "moment-jalaali": "^0.8.3",
        "moment-jalali": "^0.3.9",
        "next": "^8.1.0",
        "next-images": "^1.1.2",
        "next-routes": "^1.4.2",
        "npm": "^6.12.1",
        "numeral": "^2.0.6",
        "persianjs": "^0.4.0",
        "pm2": "^3.5.1",
        "prop-types": "^15.6.2",
        "qs": "^6.8.0",
        "react": "^16.9.0",
        "react-bootstrap-star-rating": "^3.5.5-alpha.0.3",
        "react-dom": "^16.9.0",
        "react-leaflet": "^2.4.0",
        "react-modal": "^3.9.1",
        "react-modern-calendar-datepicker": "^3.1.6",
        "react-paginate": "^5.2.4",
        "react-persian-calendar": "^1.0.3",
        "react-rating": "^2.0.4",
        "react-redux": "^5.0.7",
        "react-responsive": "^5.0.0",
        "react-select": "^2.4.4",
        "react-share": "^2.4.0",
        "react-slick": "^0.23.1",
        "react-star-ratings": "^2.3.0",
        "react-toastify": "^4.3.0",
        "redux": "^4.0.4",
        "redux-devtools-extension": "^2.13.5",
        "redux-logger": "^3.0.6",
        "redux-thunk": "^2.3.0",
        "stylus": "^0.54.5"
    },
    "devDependencies": {
        "cross-env": "^5.2.1",
        "optimize-css-assets-webpack-plugin": "^5.0.3",
        "poststylus": "^1.0.0"
    }
}

这是 next.config.js 文件:

const withCss = require('@zeit/next-css'); // used to load css files
const withStylus = require('@zeit/next-stylus'); // used to load stylus files
const withImages = require('next-images'); // used to load local images
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin'); // used to minimize the compiled css file in production mode

module.exports = {
    ...withStylus(
        withCss(
            withImages(
                {
                    cssLoaderOptions: {
                        url: false
                    },
                    // production config to minimize the compiled css file
                    webpack(config) {
                        if (config.mode === 'production') {
                            if (Array.isArray(config.optimization.minimizer)) {
                                config.optimization.minimizer.push(new OptimizeCSSAssetsPlugin({}));
            
                            }
                        }
                        return config;
                    }
                }
            )
        )
    ),
    env: {
        /*
         * api route and website route in production and development mode
         * you should use build dev routes in development mode and for nightly version
         * and use the master build routes for production mode and master build for main server
         */
        //dev build
         apiRoute: 'https://nightly.karan.ir',
         websiteRoute: 'https://nightly.karan.ir',
         useTagManager: false,

         // for master build
        //  apiRoute: "https://karan.ir",
        //  websiteRoute:  "https://karan.ir",
        //  useTagManager: true,

        // this value is used to determine which environment is active to active firebase cloud messaging or not
        enableFireBase: 'false'
    }
};

如果我在终端中按Ctrl + C,然后再次运行npm run dev,则所有更改都将应用。

0 个答案:

没有答案