javascript - 如何在不重新启动服务器的情况下更改 Javascript？

Question

我似乎无法在不重新启动服务器的情况下更改我的任何 JavaScript 文件 - 它确实扼杀了在 Phoenix 中工作的很多实时重新加载的乐趣。我不会做大量的 JavaScript，所以我不确定我是否做错了什么。

Phoenix 版本:1.2.0

重现步骤:

1. 使用 mix phoenix.new foo 创建一个新项目
2. 创建 web/static/js/foo.js 文件。
3. 在该文件中，编写 alert("Hello, world!");
4. 在 app.js 中，在底部包含 import "web/static/js/foo"。
5. 使用 mix phoenix.server 启动 Phoenix 并导航到 localhost:4000。
6. 无论您刷新页面多少次，您都会看到一个带有“Hello world!”的警告框。每次都不会失败。
7. 将 foo.js 消息编辑为“Hello worlds!”
8. 我希望我仍会收到带有更新文本的警告消息，但警告框完全停止出现。当我重新启动服务器时，它们才会再次出现。

这是有意为之的行为吗？ Phoenix 的一个错误？我是否以 Brunch 不希望的方式编写 JS 代码？这是一个 Babel 问题吗？我应该以不同的方式组织我的代码吗？

应该补充一点，我正在 Linux 上的 Chrome 中进行开发——以防这可能是浏览器问题

编辑:我不能再重现这个确切的问题，但我的非玩具项目仍然有问题:

我最初的问题是在我实际开发的应用程序中 - 我有 global.jQuery = require("jquery") 和 global.bootstrap = require("bootstrap") 在 app.js 中。如果我对这两行进行注释、保存并取消注释，我会在浏览器中收到 Javascript 错误:app.js:16Uncaught Error: Cannot find module 'jquery' from 'web/static/js/app.js'

Answer 1

• 这是有意为之的行为吗？是的。
• Phoenix 中的错误？没有。
• 我是否以 Brunch 不希望的方式编写 JS 代码？没错。
• 这是 Babel 问题吗？不。
• 我应该以不同的方式组织我的代码吗？可能吧。

Brunch(或 Node.js 或任何其他模块 bundler )需要 import 语句中的相对路径:它无法从 解析 web/static/js/foo >web/static/js/app.js 并且不将 foo.js 标记为 app.js (入口点)的依赖项。这就是为什么当 foo.js 改变时它不重建 app.js 的原因。当 Brunch 重新启动时，它会使用最新的 foo.js 完全重建 app.js(Brunch 包含它是因为 joinTo.javascripts 在配置中)来自磁盘的版本。

指定相对路径(import "./foo")并且更喜欢 import jquery from ... 而不是 global.jquery = ...