Vue3中URL函数直接传字符串与传变量为何表现不同？

这是因为Vue3项目一般基于Vite构建，Vite对**静态字符串中的路径别名（比如@public）**会在编译阶段做替换处理：

• 直接传入字符串字面量"@public/static/img/ZY3_2m.png"时，Vite能识别其中的@public别名，将其替换为项目public目录的实际物理路径，编译后的代码已经是合法路径，所以URL函数可以正常解析。
• 使用变量tempString时，@public只是变量中的普通字符串，Vite在编译阶段无法识别变量内部的别名，不会进行替换。到运行时，URL函数拿到的还是带@public的原始字符串，这个别名在浏览器环境中没有实际意义，自然无法正确解析路径。

核心点：Vite的路径别名替换仅针对静态字面量字符串，不会处理运行时的变量内容。

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