Uncaught Error: Mismatched anonymous define() module

Bertha 。 2023-03-01 10:22 3阅读 0赞

想应用js的AMD规范？没这么容易。吭哧吭哧地了解了AMD规范后，兴致勃勃地在页面上添加require.js

<script data-main="./js/modules" src="./libs/require.js"></script>

结果页面就报错了：  
Uncaught Error: Mismatched anonymous define() module

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xlZnRmaXN0_size_16_color_FFFFFF_t_70]  
这是冲突了。require.js啥事也没干，就定义了一个define函数。但是这个平平无奇的名字，其他js库可能也用了，如果一个页面引用了很多第三方js库，再将require.js加进去，很有可能就冲突了。

对于这种情况，没办法做什么修改。第三方js库，你怎么改？require.js？也不能改吧。改不了。

应对办法是在页面中加入浮动帧`<iframe>`，将require.js引用放在这里，然后页面再使用require函数。反之也可以，总之require就放在别的页面。比如：

//var require = window.top.require;
    var require = document.getElementById('Frame1').contentWindow.require;
    function wind(){ 
    	require(['wind'],function(windjs){ 
    		windjs.go(containerId,viewer,window,Cesium);
    	});
    }

完整的应用AMD规范的例子：  
[js应用模块化][js]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xlZnRmaXN0_size_16_color_FFFFFF_t_70]: /images/20230209/ecd9c00b768749a19838aaa1f8114bfc.png
[js]: https://leftfist.blog.csdn.net/article/details/107544870