Vue3+TSX项目动态导入js文件,挂载到window全局作用域中

历史小剧场

国家外患,振古有闻。赵宋末造,代于蒙古,神州陆沈,几及百年。我高皇帝,应时崛起,廓清中土,日月重明,河山再造,光复大义,昭示来兹。不幸季世俶扰,国力罢疲,满清乘间,入据中夏。嗟我邦人,诸父兄弟,迭起迭踣,至于二百六十有八年。呜呼!我高皇帝,时怨时恫,亦二百六十有八年也。岁在辛亥八月,武汉军兴,建立民国。义声所播,天下响应,越八十有七日,既光复十有七省,国民公议,立临时政府于南京。文以薄德,被推为临时大总统,瞻顾西北,未尽昭苏,负疚在躬,尚无以对我高皇帝在天之灵。迩者以全国军人之同心,士大夫之正谊,卒使清室幡然悔悟,于本月十二日宣告退位。从此中华民国完全统一,邦人诸友享自由之幸福,永永无已,实维我高皇帝光复大义,有以牖启后人,成兹鸿业。文与全国同胞至于今日,始敢告无罪于我高皇帝。敬于文奉身引退之前,代表国民,贡其欢欣鼓舞之公意,惟我高皇帝实鉴临之。敬告。-------孙中山《祭明孝陵文》

前言

最近,在一个需求中,我们这边需要和第三方厂商对接,第三方给了我方一个js文件,需要我方这边调用该文件中的某一个方法进行数据交互,但是我们这边使用的是Vue3+TS的项目。在最开始,我把JS文件转成了TS,然后将需要调用的文件export出去,然后我在TSX业务组件中去import,然后再进行调用,但是出现了一点问题。且第三方这个有很多问题,然后一下改这改那,我这边也比较繁琐。然后我就不转了,直接讲js文件挂载到window全局作用域中。但是,这里需要注意作用域的概念,为了避免这个js文件中的一些方法可能与我整个项目中一些全局变量所冲突,所以,我用了一个匿名函数将整个js文件中的内容包裹起来,然后将需要调用的方法return出去。

修改js文件放到项目静态文件目录下 assets

js 复制代码
window.$hlyy = function () {
	.... 原来的js文件中的内容
	return {
		PharmacistCheck.  // 业务组件需要调用的方法
	}
}

在业务组件中setup()函数中动态导入

js 复制代码
export default defineComponent({
	setup() {
		import("@/assets/js/hlyy3.js" as string);
	}
})

在浏览器环境中验证

相关推荐
2601_957780842 分钟前
Claude Code 2026年最新部署指南:从环境搭建到技能扩展
前端·人工智能·ai编程·claude
qq_4228286219 分钟前
android图形学之SurfaceControl和Surface的关系 五
android·开发语言·python
zhangfeng113319 分钟前
workbuddy 专家 “前端开发师” 结合nvidia-mistral-small-4-119b-2603 项目计划-前端界面开发.md
前端·人工智能·免费
如竟没有火炬1 小时前
用队列实现栈
开发语言·数据结构·python·算法·leetcode·深度优先
折哥的程序人生 · 物流技术专研1 小时前
《Java 100 天进阶之路》第17篇:Java常用包装类与自动装箱拆箱深入
java·开发语言·后端·面试
C+++Python2 小时前
C 语言 动态内存分配:malloc /calloc/realloc /free
c语言·开发语言
水木流年追梦2 小时前
大模型入门-应用篇3-Agent智能体
开发语言·python·算法·leetcode·正则表达式
凯瑟琳.奥古斯特2 小时前
假脱机技术原理详解
开发语言·职场和发展
IT_陈寒2 小时前
为什么Java的Stream并行处理反而变慢了?
前端·人工智能·后端
敲代码的瓦龙3 小时前
Java?枚举!!!
java·开发语言