如何处理作为ES6模块导入的JavaScript文件的缓存 旧情

以前，如果有新版本可用，我使用以下方法强制浏览器重新加载我的JavaScript文件

<script src="common.js?version=1337"></script>
<script src="app.js?version=1337"></script>

问题 现在我的问题是：在新的场景中，我如何影响

common.js

的缓存

---

我不想每次编辑

common.js

时都手动编辑

app.js

。如果可能的话，我也不想动态生成/预处理任何JavaScript文件。

ES6模块可以导入输出有效JS的PHP文件。只要您还设置了正确的标题，您就应该可以了

因此，您的

index.php

文件将包含：

<script src="app.js.php?version=1337" type="module"></script>

<?php
  header("Content-Type: application/javascript");
  $version = 1337; // Probably imported form some config file;
?>
import {foo, bar} from './common.js.php?version=<?=$version?>';

---

服务工作者可用于处理模块请求。本机ES模块实现无法处理此类问题，这就是为什么捆绑工具在生产中仍然没有其他选择。我编写并回答了您可能会感兴趣的类似问题，该解决方案假设您使用php生成js文件。我很想看到一个静态js文件的解决方案。没有“导入PHP文件”。PHP在远程HTTP服务器上运行，生成HTTP响应，该响应是一个有效的JavaScript文本，这就是最终实际导入的内容。我知道你可能不是有意暗示ES6实际上允许导入PHP代码，但重要的是要注意，人们可能从你的答案中读到的内容与HTTP开发人员应该绝对清楚的内容之间的区别（在我看来，Web开发人员应该努力做到这一点）--无论是通过调用PHP还是通过其他方式，HTTP服务器都可以随意生成任何响应。

<script src="app.js.php?version=1337" type="module"></script>

<?php
  header("Content-Type: application/javascript");
  $version = 1337; // Probably imported form some config file;
?>
import {foo, bar} from './common.js.php?version=<?=$version?>';