Uncaught Error: Mismatched anonymous define() module- 前端开发

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

<!-- AMD规范 -->
<script data-main="./js/modules" src="./libs/require.js"></script>
1
2

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

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

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

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

浮动帧页面：frame.html，引入了require

<html>
<head
<script data-main="./js/modules" src="./libs/require.js"></script>
</head>
...
1
2
3
4
5

嵌套浮动帧的页面，想使用require

<html>
<head></head>
<body>
<div>
<iframe id="iframe1" src="frame.html" /> 
</div>
</body>
<script>
//此require，乃浮动帧之require也
var require = document.getElementById('iframe1').contentWindow.require;
function wind(){
	require(['wind'],function(windjs){
		windjs.go(containerId,viewer,window,Cesium);
	});
}
</script>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17