script标签引入unpkg的url-join.js后如何正常使用urlJoin方法

你引入的是ES Module格式的脚本：

• 普通无属性的<script>标签加载ES Module文件时，模块内部的导出内容不会暴露到全局window作用域，直接全局调用urlJoin自然会报未定义错误。
• ES模块的导出内容只能通过import语法在模块作用域内获取。

二选一即可：

方案1：替换为UMD版本（适配现有直接引入script的写法，改造成本最低） #

直接把引入地址换成UMD构建版本，这个版本会自动把urlJoin挂载到全局，无需额外修改调用逻辑：

<script src="https://unpkg.com/url-join@5.0.0/lib/url-join.umd.js"></script>
<script>
  // 引入后直接调用即可
  const res = urlJoin('https://your-domain.com', 'api', 'user');
</script>

方案2：按ES模块规范引入 #

给script标签加type="module"属性，通过import语法导入函数，如果要在其他普通脚本里用，手动挂到window即可：

<script type="module">
  import urlJoin from 'https://unpkg.com/url-join@5.0.0/lib/url-join.js';
  window.urlJoin = urlJoin;
</script>
<script>
  // 后续普通脚本可直接调用
  console.log(urlJoin('/static', 'css', 'main.css'));
</script>

内容的提问来源于stack exchange，提问作者Milano