【发布时间】：2019-10-31 15:49:28
【问题描述】：
我在https://github.com/sbwrege2z/webpack-test 有一个非常简单的应用程序。
这是主应用程序的代码：
const UrlPattern = require('url-pattern');
const serviceWorkerRouter = require('service-worker-router');
const router = new serviceWorkerRouter.Router();
// THIS METHOD OF ROUTING DOES NOT CAUSE A PROBLEM:
router.get('/api/*', null);
// CAUSES BUNDLE TO BREAK:
router.get(new UrlPattern(/^\/api\/(.*)$/), null);
console.log('Hello world!');
当您使用“node src/index.js”运行此文件时，您会得到预期的“Hello world！”输出。
当您使用“node dist/bundle.js”运行 Webpack 创建的包时，您会收到错误：
TypeError: argument must be a regex or a string
如果您使用“new UrlPattern(...)”注释掉该行，则捆绑包将毫无问题地运行。使用定义 url 模式的正则表达式方法导致它中断。
有人知道为什么会这样吗？
更新
我知道是什么导致了问题。我只是还没有想出解决方案。
UrlPattern 构造函数需要一个字符串或 RegEx 作为第一个参数。
Router get 方法要求第一个参数是字符串或 URLPattern。如果第一个参数不是 UrlPattern 的实例，它会使用第一个参数创建一个新的 UrlPattern。我确定假设它是一个字符串或 RegEx，但它不检查。
在缩小过程中，Router 无法将传递给 get 方法的第一个参数识别为 UrlPattern，因此它尝试使用第一个参数（即 UrlPattern）创建一个新的 UrlPattern。由于 UrlPattern 构造函数的第一个参数既不是字符串也不是 RegEx，因此会引发错误。
可能的解决方案：
弄清楚如何配置 WebPack 的缩小过程，以便将 UrlPattern 识别为 UrlPattern 的实例。
有什么想法吗？
【问题讨论】：
-
这不是 url-pattern 模块的问题。我在没有引用 service-worker-router 模块的存储库中添加了一个 index2.js 文件，并且从中创建的 b.bundle.js 工作正常。我怀疑它与 service-worker-router 模块有关。据我所知，service-worker-router 使用与我的项目相同版本的 url-pattern --- 1.0.3。
-
请问您要做什么？看起来
UrlPattern库旨在检查给定的 URL 是否与特定的正则表达式模式匹配。我不认为它打算用作 url 格式化之类的交易——这就是这里发生的事情。 -
当然。我正在构建一个充当路由器的 cloudflare 服务工作者。它将 url 转换为 AWS S3 存储上的资源位置。为此，我真的希望能够在路由中使用正则表达式。提供的代码只是问题的一个非常简单的说明。当我对 service-worker-router 使用正则表达式时，我遇到了上传到边缘的生成的 webpack 包的问题。
-
我想弄清楚的是，捆绑过程会破坏未捆绑时可以正常工作的应用程序吗？
-
我更新了 repo。有 2 个入口点（index.js 和 index2.js）和两个包（bundle1.js 和 bundle2.js）。这两个应用程序的唯一区别是 1 行代码。没有该行的 bundle2.js 有效，而带有该换行符的 bundle1.js。
标签： node.js webpack service-worker