일치하지 않는 익명의 define () 모듈
웹 애플리케이션 을 처음 탐색 할 때 (일반적으로 캐시가 비활성화 된 브라우저에서) 이 오류가 발생 합니다.
오류 : 일치하지 않는 anonymous define () 모듈 : function (필수) {
HTML :
<html>
.
.
.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script> var require = { urlArgs: "v=0.4.1.32" }; </script>
<script data-main="assets/js/main" src="assets/js/libs/require.js"></script>
<script src="assets/js/ace/ace.js?v=0.4.1.32"></script>
</body>
</html>
JS :
$(function () {
define(function (require) {
// do something
});
});
이 오류의 의미와 발생 원인을 정확히 아는 사람이 있습니까?
소스 파일 , github 이슈 페이지에서 그것에 대한 짧은 토론
AlienWebguy 말했듯이, 워드 프로세서 당 require.js는 폭파 할 수 있는 경우
- 자체 스크립트 태그에 익명의 define ( " 문자열 ID없이 define ()을 호출하는 모듈 ")이 있습니다 (실제로는 전역 범위의 어느 곳이든 의미한다고 가정합니다)
- 이름이 충돌하는 모듈이 있습니다
- 로더 플러그인 또는 익명 모듈을 사용하지만 require.js의 옵티 마이저를 사용하여 번들로 묶지 마십시오.
require.js 모듈과 함께 browserify로 빌드 된 번들을 포함시키는 동안이 문제가 발생했습니다. 해결책은 다음 중 하나였습니다.
A. require.js가로드 되기 전에 스크립트 태그에 non-require.js 독립형 번들을 로드하거나
B. 스크립트 태그 대신 require.js를 사용하여로드
스크립트 태그에 직접 포함 된 다른 라이브러리와 requirejs 파일을 포함했기 때문에이 오류가 발생했습니다. lodash와 같은 해당 라이브러리는 require의 define과 충돌하는 define 함수를 사용했습니다. requirejs 파일이 비동기 적으로로드되고 있으므로 요구 사항 정의가 다른 라이브러리가 정의 된 후에 정의되므로 충돌이 발생합니다.
오류를 제거하려면 requirejs를 사용하여 다른 모든 js 파일을 포함하십시오.
문서 당 :
익명의 define () 호출로 스크립트를로드하기 위해 HTML로 스크립트 태그를 수동으로 코딩하면이 오류가 발생할 수 있습니다.
또한 이름이 지정된 몇 개의 모듈이있는 스크립트를로드하기 위해 HTML에서 스크립트 태그를 수동으로 코딩 한 다음 수동으로로드 한 스크립트의 이름이 지정된 모듈 중 하나와 이름이 같은 익명 모듈을로드하려고 시도하는 경우 코드화 된 스크립트 태그.
마지막으로 로더 플러그인 또는 익명 모듈 (문자열 ID없이 define ()을 호출하는 모듈)을 사용하지만 RequireJS 최적화 프로그램을 사용하여 파일을 결합하지 않으면이 오류가 발생할 수 있습니다. 최적화 프로그램은 익명 모듈의 이름을 올바르게 지정하여 최적화 된 파일의 다른 모듈과 결합 할 수있는 방법을 알고 있습니다.
오류를 피하려면
RequireJS API를 통해 define ()을 호출하는 모든 스크립트를로드하십시오. define () 호출이있는 스크립트를로드하기 위해 HTML에서 스크립트 태그를 수동으로 코딩하지 마십시오.
HTML 스크립트 태그를 수동으로 코딩하는 경우 이름 지정된 모듈 만 포함하고 해당 파일의 모듈 중 하나와 이름이 같은 익명 모듈이로드되지 않아야합니다.
로더 플러그인 또는 익명 모듈을 사용하는 데 문제가 있지만 RequireJS 최적화 프로그램이 파일 번들링에 사용되지 않는 경우 RequireJS 최적화 프로그램을 사용하십시오.
reactjs를 시작하면서 문제에 부딪 쳤고 초보자는 문서 를 그리스어로 작성했을 수 있습니다.
내가 겪었던 문제는 대부분의 초보자 예제에서 "문자열 ID"를 사용해야 할 때 "익명 정의"를 사용한다는 것입니다.
익명 정의
define(function() {
return { helloWorld: function() { console.log('hello world!') } };
})
define(function() {
return { helloWorld2: function() { console.log('hello world again!') } };
})
문자열 ID로 정의
define('moduleOne',function() {
return { helloWorld: function() { console.log('hello world!') } };
})
define('moduleTwo', function() {
return { helloWorld2: function() { console.log('hello world again!') } };
})
When you use define with a string id then you will avoid this error when you try to use the modules like so:
require([ "moduleOne", "moduleTwo" ], function(moduleOne, moduleTwo) {
moduleOne.helloWorld();
moduleTwo.helloWorld2();
});
Be aware that some browser extensions can add code to the pages. In my case I had an "Emmet in all textareas" plugin that messed up with my requireJs. Make sure that no extra code is beign added to your document by inspecting it in the browser.
The existing answers explain the problem well but if including your script files using or before requireJS is not an easy option due to legacy code a slightly hacky workaround is to remove require from the window scope before your script tag and then reinstate it afterwords. In our project this is wrapped behind a server-side function call but effectively the browser sees the following:
<script>
window.__define = window.define;
window.__require = window.require;
window.define = undefined;
window.require = undefined;
</script>
<script src="your-script-file.js"></script>
<script>
window.define = window.__define;
window.require = window.__require;
window.__define = undefined;
window.__require = undefined;
</script>
Not the neatest but seems to work and has saved a lot of refractoring.
Or you can use this approach.
- Add require.js in your code base
- then load your script through that code
<script data-main="js/app.js" src="js/require.js"></script>
What it will do it will load your script after loading require.js.
참고URL : https://stackoverflow.com/questions/15371918/mismatched-anonymous-define-module
'development' 카테고리의 다른 글
| EditorFor () 및 html 속성 (0) | 2020.07.27 |
|---|---|
| Python으로 ssh를 통해 명령 수행 (0) | 2020.07.27 |
| 양식 제출 후 Jquery 콜백을 수행하는 방법은 무엇입니까? (0) | 2020.07.26 |
| JNA 대신 JNI를 사용하여 기본 코드를 호출 하시겠습니까? (0) | 2020.07.26 |
| 루비 : 자기 확장 (0) | 2020.07.26 |