AJAX 양식을 제출할 때 Webpack 오류가 발생했습니다.

Question

AJAX를 사용하여 문의 양식을 제출하려고합니다. 지금까지 수백 번 완료되었지만 이전에는 webpack을 사용한 적이 없었습니다.

내하는 index.js 내가 웹팩 실행하면

$document.on('click', '#btn-submit-modal'), function(event){ 
    event.preventDefault(); 
    $.post("mailtest.php", $("#contactform").serialize()); 
}); 

파일 나는 다음과 같은 오류 메시지가 얻을 :

ERROR in ./src/js/index.js 
Module parse failed:  
..../index.js Unexpected token (24:1) //changed path for readability 
You may need an appropriate loader to handle this file type. 
| 
| $.post("mailtest.php", $("#contactform").serialize()); 
| }); 
| 
@ ./src/app.js 2:16-40 
@ multi (webpack)-dev-server/client?http://localhost:8081 ./src/app.js 

나는 문제가 무엇 단서가 없다합니다. mailtest.php이 내 src 디렉토리에 있습니다. 나는 왜 이런 식으로 하드 코드를 만들지 않고 .php 파일을 내 서버에 밀어 넣을 수 없는지 궁금해. 정말 실망스러워.

도움을 주셨습니다.

Answer 1

파일 이름이나 파일의 존재 여부와 관계가 없습니다. 문제는 사용중인 코드가 유효한 자바 스크립트가 아니라는 것입니다. 당신도 그것을 실행하지 못하면, 그것이 webpack에 의해 파싱되면 실패합니다. 당신이하고 싶었던 무엇

는

$document.on('click', '#btn-submit-modal'), function(event){ 
    event.preventDefault(); 
    $.post("mailtest.php", $("#contactform").serialize()); 
}); 
^ 
Unexpected parenthesis 

.on 함수에 다른 매개 변수로 함수를 통과,하지만 당신은 '#btn-submit-modal' 후 괄호를 폐쇄, 그래서 마지막 줄에 괄호는 타의 추종을 불허하기 때문에 유효하지 않습니다. 올바른 코드는 다음과 같습니다.

$document.on('click', '#btn-submit-modal', function(event){ 
    event.preventDefault(); 
    $.post("mailtest.php", $("#contactform").serialize()); 
});