Parcel编译后图片资源引用与TypeScript动态切换图片的问题咨询

大家好，我最近在做一个图片轮播功能时遇到了Parcel打包相关的问题，想请教一下各位：

我的需求是从assets\png\slidingImage\文件夹加载图片，支持点击切换或者定时X秒自动切换到下一张。最开始我打算通过修改文件名里的序号（比如把SlidingImage_3.png改成SlidingImage_4.png）来实现图片切换，但Parcel打包后会自动把图片重命名成SlidingImage_3.SOME_NUMBERS.png的格式，每个图片的随机后缀都是唯一的，这直接导致我原来的文件名替换逻辑完全失效了。

我的具体问题： #

• Q1：怎么才能正确引用Parcel打包之后的图片资源？
• Q2：只通过TypeScript来设置图片的src属性应该怎么做？在大型项目里通常是怎么处理这类动态图片切换需求的？
• Q3：有没有办法在打包后指向某个文件夹里的第一张或特定文件？能不能根据文件名里的标识（比如序号）来找到对应的文件？

另外，我之前写了一段切换图片的代码，本意是根据激活的圆点数据来替换URL里的序号，但因为Parcel添加的随机后缀，根本起不了作用：

changeImage() {
  let oldURL: string = this.#slidingImage?.getAttribute(`src`) as string;
  const newURL = oldURL?.replace(`_${this.#oldActiveDot?.getAttribute('data-dot')}`, `_${this.#activeDot?.getAttribute('data-dot')}`);
  this.#slidingImage?.setAttribute('src', oldURL);
}

注：代码里最后设置src时应该是用newURL，这里可能是笔误，但即便修正了，因为Parcel的重命名，URL替换还是不生效。

打包后打印出来的图片URL是类似SlidingImage_3.xxxxxx.png这样的格式，随机生成的后缀彻底打乱了我的替换逻辑。

麻烦各位帮忙解答一下，提前感谢！

备注：内容来源于stack exchange，提问作者0sergej