【问题标题】:Nodemon not refreshing browser in React-Express-Node AppNodemon 未在 React-Express-Node 应用程序中刷新浏览器
【发布时间】:2017-08-26 10:49:05
【问题描述】:

我已经在我的工作区中安装了nodemon 本地,但是即使它在进行更改后在终端中重新启动,它也不会刷新浏览器页面。每次都要手动刷新。

我已经在环境中运行了 Express、Node、React 和 Webpack。

这就是我的设置的样子 -

我的package.json 启动server.js -

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "nodemon server.js"
  },

server.js 是 -

var express = require('express');


     var app = express();
        app.use(express.static('public'));
        app.listen(3000, function () {
            console.log("Express server is up on port 3000");
        });

webpack 配置文件中的entry point 是 -

module.exports = {
    entry: './public/scripts/app.jsx',
    output: {
        path: __dirname,
        filename: './public/scripts/bundle.js'
    }

我应该怎么做才能修复它?


更新 -

我发了video 来描述情况,如果有帮助的话。

【问题讨论】:

    标签: javascript reactjs webpack nodemon


    【解决方案1】:

    对于那些需要使用nodemon并在更改时重新加载浏览器的人,我在这里回复https://stackoverflow.com/a/51089425/7779953

    解决方案是 Nodemon + Browser Sync + Gulp + Express server

    【讨论】:

      【解决方案2】:

      在 package.json 中

      "scripts": {
         "start": "nodemon server.js -e html,js,css"
      },
      

      在服务器 js 中

      var reload = require('reload')
      
      app.listen(3000, () => {
      
        console.log(`Listening on port 3000`);
      })
      
      reload(app);
      

      在 index.html 中

      <body>
        <h1>ron</h1>
        <script src="/reload/reload.js"></script> <!-- it's necessary -->
      </body>
      

      【讨论】:

      【解决方案3】:

      nodemon 仅用于在您的服务器代码更改时重新启动服务器。它没有在浏览器中重新加载页面的功能。如果你想要自动重新加载浏览器,例如,除了你的 nodemon 之外,你还可以运行一个 webpack 开发服务器。当您的客户端代码更改时,webpack 开发服务器能够在浏览器中重新加载页面,如果您使用其热模块重新加载功能,它甚至可以在不重新加载整个页面的情况下更新浏览器中的页面。

      【讨论】:

      • 你有如何做到这一点的例子吗?
      • 我的应用中有服务器端渲染。一旦我的反应代码更改,浏览器将刷新页面,但问题在于服务端呈现的 html。它仍然保持不变,直到我终止服务器
      • 我在服务端和客户端都以监视模式运行 webpack 以防止这种情况发生
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-04-17
      • 2023-02-22
      • 2022-07-15
      • 1970-01-01
      • 2019-03-27
      • 1970-01-01
      相关资源
      最近更新 更多