问题标签 [react-hot-loader]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
3 回答
187 浏览

reactjs - ES6 无法编译

有人在我的 webpack.config.js 文件中看到我做错了什么吗?浏览器给我一个错误提示“unexpected token 'import'”,这意味着它无法识别 ES6 语法。我对装载机做错了吗?我已经多次安装和重新安装依赖项,所以我认为这不是问题所在。

webpack.config.js

0 投票
1 回答
14046 浏览

javascript - React + Webpack HMR 正在刷新页面(不是热加载)

我在让 react-hot webpack 加载器正常工作时遇到了一些麻烦。

当我加载页面时,我会得到以下信息:

[HMR] 等待来自 WDS 的更新信号...
[WDS] 启用热模块更换。

但是当我保存更改时,页面会自动硬刷新浏览器(而不是 HMR 替换)。

命令:webpack-dev-server --hot --inline

如果我使用babel-preset-react-hmre一切都按预期工作,那么在一个有趣的旁注中。(但是我真的不想使用它,因为它似乎不如正确的 react-hot 加载器受支持)。

0 投票
1 回答
2463 浏览

javascript - Webpack 开发服务器尝试连接到错误的 url

每次我试图给它一个成为我朋友的机会时,我都遇到了 webpack 的问题!这次我尝试使用 react-hot-loader、webpack 和 webpack-dev-server 启用热模块重新加载,但似乎 webpack-dev-server 试图在浏览器中获取错误的 url。

这是来自 Chrome v50 控制台的错误:

完整的日志:

这是我的 webpack 配置:

0 投票
1 回答
1796 浏览

javascript - 使用 webpack-dev 反应热加载器 3

我正在尝试在我的项目中使用 hot-react-loader。因此,我更改了一些文件以使用它,但是在编辑组件时出现错误。

警告:React.createElement:类型不应为 null、未定义、布尔值或数字。它应该是一个字符串(对于 DOM 元素)或一个 ReactClass(对于复合组件)。

[HMR] 无法应用更新。需要完全重新加载!

我究竟做错了什么?

webpack.config.dev.js

服务器.js

index.js

应用程序.js

0 投票
0 回答
161 浏览

javascript - 试图让 React Hot、Express 和 Webpack 一起工作

我是一个决定学习一些前端的后端人员,但似乎我离学习还很远,因为我什至无法配置环境。

我的目标是使用 Babel 6、React、react-hot 和 HotModuleReplacementPlugin 设置 Webpack。我还希望该应用程序具有 express.js 服务器。所以这是我的配置:

server.js:

webpack.config.js

公共/index.html

src/App.js

src/index.js

这是我在控制台中得到的(错误是循环的):

错误循环

0 投票
2 回答
1703 浏览

webpack - React Hot Loader 3 与 Webpack 并在生产中

我正在使用 Webpack 和 React Hot Loader v3。在开发中,它的工作大部分与预期一致。但是,我希望在输出静态捆绑文件时禁用热加载功能

webpack --progress -p

但是我得到的是这种重复的错误;

在此处输入图像描述

这是我的 Webpack 配置;

我得到了尝试禁用的建议HotModuleReplacementPlugin(),但仍然出现相同的错误。关于我在这里缺少什么的任何想法?

0 投票
1 回答
32 浏览

javascript - Windows 上的 React Hot Loader 零星更新

react-hot-loader不会在 Windows 7 上更新文件保存(大部分时间)。在我的 Mac 上尝试了相同的代码,并且每次都有效。

搜索潜在问题,但空无一物。

在执行文件更改的操作系统级别通知时,Windows 是否有怪癖?

有什么想法可以解决这个问题吗?

0 投票
1 回答
343 浏览

ruby-on-rails - 带有 react-hot-loading 和 rails 的 Webpack

我在我们的 Rails 应用程序中使用 React 和 webpack 的 react-hot-loader 插件设置了 Webpack。它正在成功运行并构建bundle.js我期望的文件,但它也在每次热更新时给我这样的文件0.bfeb31eda5c7e8da9473.hot-update.js。我正在使用的一个插件的作者WriteFileWebpackPlugin说,我可以在test属性中告诉它不要监视.hot其中的文件,但我不知道如何让它工作。

这是我的 webpack.config.js

有没有其他人遇到过这个?理想情况下,我想弄清楚test如果可能的话,是否可以在没有该属性的情况下解决此问题,但即使只是弄清楚这一点也会有所帮助。

0 投票
2 回答
3939 浏览

webpack - 开发服务器未热重载,无法构建

我正在开发一个 react/redux 应用程序,在本地使用 npm-piped hapi.js 后端在端口:3000 上提供服务,并在端口:3001 上运行 webpack-dev-server;

我有几个 api 路由返回以提供静态文件,然后我使用 {param*} 规则从我的 build/public 目录中点击资产文件。为了使它工作,我在 WebpackDevServer 上有一个代理,它将请求转发回端口:3000

我已经CSSModules执行了 . scss,并且还有其他几个加载器。

当我第一次设置它时,它按预期工作。我可以添加文件、保存内容、执行构建,然后 HMR 会做它的事情,并更新 dom。工作得很好。在某些时候,这停止工作得很好。:3000 上的后端进行重建和重新加载,而 :3001 上的前端收到如下错误:

我注意到那里有对 :8080 的引用(webpack-dev-server 默认值),但我的引用都是对 :3000/1 的引用。

当这个堆栈运行良好时 - 我可以保存 server.js 并且 hapi 服务器将自行重启(由于 npm 管道),并且 webpack 构建将按预期进行。目前构建从 server.js 间歇性失败,我必须手动$ webpack重新加载浏览器以触发构建并成功刷新。这显然违背了这一点。

重要信息:

服务器.js

webpack.config.js

一直在修改所有设置,所以我可能会修改一直在工作的东西。但这似乎应该按预期运行。

对此配置堆栈的任何见解将不胜感激。项目来源:github

最好的 -

0 投票
2 回答
1567 浏览

docker - Inotify 不适用于 Docker for mac

我想为react-hot-loader创建 Docker 容器。但是 inotify 可能在容器内不起作用。因此 HMR 被破坏了。

我使用 Docer for mac 版本 1.12.0-rc2-beta16(内部版本:9493)。

这是我的 docker-compose.yml。

我的 Dockerfile 在下面

我将react-hot-loader目录放在同一目录中。

当我执行时docker-compose up,我可以访问localhost:8000并且我的 React 项目运行良好。但是,即使我在本地机器上编辑我的 React 组件,HMR 也不起作用。

当我尝试在容器中编辑我的 React 组件时,HMR 运行良好。

此外,我检查了 inotify 是否使用inotify-tools运行良好。然后当我在本地机器上编辑文件时 inotify 不起作用。当然,当我在容器内编辑文件时,它运行良好。