问题标签 [webpack-dev-server]

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 投票
10 回答
54524 浏览

webpack - Webpack:静音输出

我想知道是否有配置选项告诉 webpack 只将“重要信息”记录到终端。几乎只是错误和警告,而不是全部:

使用 webpack 输出终端

有这么多的输出!很想压制常见的东西,只让 webpack 输出警告/错误。想要 , 和 的webpack解决webpack-dev-server方案karma-webpack

注意:我试过了noInfo: truequiet: true但这似乎没有奏效。


编辑:我认为这可能是不可能的,所以我在 github 上创建了一个问题:https ://github.com/webpack/webpack/issues/1191

0 投票
1 回答
109 浏览

npm - webpack-dev-server & jsxhint: const '$__0' 已经被声明

不知何故,当我运行以下命令时,jsxhint 似乎正在分析 webpack 编译的文件

我收到这些警告

应用程序中大约 30% 的文件。

当我转到Sources Tab > webpack:// > . > relative-path-to-file. 我试图找到这些文件在磁盘上的位置,以将它们添加到预加载器的排除列表中,但是根据webpack-dev-server 文档,这些文件是从内存中提供的。

我已经尝试完全删除应用程序和所有节点模块并从存储库中再次检出,但这并没有解决问题。

删除文件夹后更新 package.json 文件中的节点模块后,问题开始出现node_modules。我已经尝试回滚到所有节点模块的先前版本,但问题仍然存在。

webpack.config.js 的内容

包.json

0 投票
1 回答
2198 浏览

javascript - Webpack:仅通过特定配置为 IE9 加载脚本

我今天决定尝试 webpack,但现在遇到了一个问题。

我们的应用程序与 api 对话。该 api 是可配置的,到目前为止,我一直在通过允许我的 gulpfile 的配置选项来做到这一点,这将确保使用正确的配置选项创建 config.js。

我可以用 webpack 做同样的事情,但我觉得我应该能够更漂亮地解决它。我研究了DefinePlugin。这部分解决了我的问题,因为我能够定义在构建 .js 文件中使用的属性。

但是,由于我使用的是跨浏览器请求,因此我也在 index.html 中加载了 xdomain:

这就是问题开始的地方:definePlugin 插件只定义了在构建的javascript 文件中使用的变量,而不是在 HTML 中。所以,我可以把这些东西移动到一个 JS 文件中,但是我不知道如何使它只在 IE9 中,与 webpack 结合使用。

任何人都可以启发我吗?

0 投票
6 回答
15593 浏览

webpack - webpack 热模块替换:css 不刷新

到目前为止,我一直在使用 livereload,这样每当我更改 JS 或模板时,页面都会刷新,当我更改 CSS 时,它会在不刷新的情况下热交换新的 CSS。

我现在正在尝试 webpack,几乎得到了相同的行为,除了一个例外:当 CSS 更改时,它会刷新整个窗口。是否可以在不刷新的情况下使其热交换 CSS?

到目前为止的配置:

0 投票
0 回答
150 浏览

javascript - HotModuleReplacement 可以在不同的 url 上运行吗?/ 而不是 /webpack-dev-server/?

我们在 react 和热模块更换方面做了很多工作,很高兴与我们合作。但是,当有人访问 / 或任何其他 url 时,如何默认在 bundle 中启动 HotModuleReplacement?

我想在开发过程中改变行为并“删除”“/webpack-dev-server/”。对于部署,我们有一个没有热模块的 webpack.config,但是有额外的“/webpack-dev-server/”url 的原因是什么?

原因不如我最初的问题重要:你如何改变这种行为?

0 投票
4 回答
3670 浏览

docker - webpack-dev-server 热加载不适用于 boot2docker

我目前正在尝试通过 boot2dockerwebpack-dev-server进行热加载

通过使用,我在容器中正确获取了文件更改docker-osx-dev,但 socket.io 热重载不起作用。

原因是我--host 0.0.0.0在运行服务器时进行了设置,以便可以在我的主机上访问它。然而,这意味着它正在寻找位于0.0.0.0.

因此,当我加载页面时,它会尝试连接到http://0.0.0.0:8080/socket.io/?EIO=3&transport=polling&t=1434584701670-0我的领事时出现错误。实际上它应该连接到http://dockerhost:8080/socket.io/.

有没有办法告诉webpack-dev-server使用不同的主机来获取 socket.io 连接?

Github issue 63可能涉及相同的问题,但尚未解决。

0 投票
12 回答
20824 浏览

webpack - 如何让 webpack 不那么冗长?

韦斯·克雷文的新噩梦

在此处输入图像描述

为什么我什至需要对每一点改变都感到恐惧?我怎样才能关闭这些通知?!

0 投票
3 回答
16535 浏览

webpack - Webpack用小项目创建大文件

我让我的 webpack 生成了一个大型 main.js 文件(1.7mb),其中包含一个约 20-30 个文件的小项目,每个文件少于 100 行。所需的依赖项数量很少(React、Fluxible),我正在使用我能理解的每个优化插件:

我做错了什么或者我可以在哪里进一步改善文件的大小?

0 投票
2 回答
1085 浏览

reactjs - 使用“babel”加载程序时,Node.js 的 Firebase 库会中断。具体来说:“未捕获的类型错误:无法读取未定义的属性‘导航器’”

我正在使用 ReactJS、Webpack、Babel 和 Firebase 构建一个应用程序。

当我运行 webpack 以使用 babel 加载程序捆绑我的代码时,我看到以下内容被打印在许多其他行中:

[BABEL] 注意:代码生成器对“/Users/.../myproject/node_modules/firebase/lib/firebase-web.js”的样式进行了优化,因为它超过了“100KB”的最大值。

然后,当我尝试在我的应用程序中使用 require('firebase'),然后在浏览器中运行它时......浏览器会在控制台中打印出以下内容。

PlayerStore.js:3 是我的行:

当我尝试加载我的应用程序时,有谁知道是什么导致了这个错误?我不确定这个错误是否开始是因为我从使用 Webpack 中的 jsx-loader 切换到了 babel,或者因为我运行了“npm update”并且我正在使用的一个包的新版本正在破坏事情。

0 投票
1 回答
2694 浏览

express - 为什么我们需要在 express.js 服务器上使用代理才能获得与 react-routing 相结合的 webpack 热重载服务器功能

可选信息:我正在尝试使用marty.jswebpack 开发服务器构建这个项目,允许入口点来自,允许来自react-router 的以便它不仅仅在 \ 路径中工作。

因此,我整天都在研究这个堆栈溢出答案,但我无法理解以下代码背后的逻辑以及为什么这个答案有效。

retozi 回答:

我设置了一个代理来实现这一点:

您有一个常规的快速网络服务器,它在任何 > 路由上为 index.html 提供服务,除非它是资产路由。如果它是资产,则请求被代理到 web-dev-server

您的 react hot 入口点仍将直接指向 webpack 开发服务器,因此热重载仍然有效。

假设您在 8081 上运行 webpack-dev-server,在 8080 上运行您的代理。

我的代码现在看起来像这样,但为了让它工作,我稍后需要实现marty-express。为了实现这一点,我必须首先了解 retonzis 的答案。

express.js 文件

要求

代理人

马丁特快**

我打算在理解这个例子后立即使用它,我只是希望它将反应路由传递给 express。**

表达东西

2台服务器 webpack-dev-server 和 express

有人可以像我昨天从火星下来一样向我解释这个概念吗?

我不明白两件事:

  1. 为什么我们需要代理
  2. 如何将 react-routes 传递给 express,以便在被询问时在每条路线上为它们提供服务。 (也许marty-express可以帮助我们完成这项任务,但我猜我们可以在没有它的情况下手动完成)

呸...帮助我摆脱这种文档稀缺地狱!请大方地回答。请记住,我昨天刚从火星来。

谢谢..!