module 질문있습니다.
586
14 asked
.js로 아래와 같은 자바스크립트 파일을 작성했습니다.
export function log(message) {
console.log(message);
}
export function error(message) {
console.error(message);
}해당 자바스크립트 파일을 html에 삽입하기 위해 src에 넣고, type을 module로 지정했습니다.
후에 log함수를 이용하려고 아래 코드를 작성했는데,
"Uncaught ReferenceError: log is not defined at 3-14.html:9:7" 이라고 에러가 납니다.
<!DOCTYPE html>
<html>
<head>
<title>Document</title>
</head>
<body>
<script src="./scripts/3-13.Module.js" type="module"></script>
<script>
log("메세지 출력"); // Uncaught ReferenceError: log is not defined at 3-14.html:9:7 에러 출력
</script>
</body>
</html>
여기서 질문이 2가지가 있는데,
위의 코드 에러를 해결하려면 어떻게 해야하나요?
모듈을 삽입하는 방법으로 script 안에 type을 모듈로 정의하고 import를 통해 삽입하는 방법과,
src에 자바스크립트를 사용하여 삽입하는 2가지 방법이 존재한다고 이해했습니다. 그럼 후자의 방법은 단순히 src만 입력해 해당 자바스크립트 안에 있는 모든 함수, 변수를 사용하는 방법을 말하는 걸로 이해하면 될까요?
답변주시면 감사하겠습니다.! 항상 강의 잘 듣고 있습니다. 좋은 강의 내주셔서 정말 감사합니다 . ㅎㅎ 😃
Answer 1
0
안녕하세요, 인프런 AI 인턴입니다.
- 에러를 해결하시려면 HTML 파일 내의 script 태그에서 모듈을 가져와 사용할 수 있도록 import 구문을 추가해주셔야 합니다. 예를 들어:
<script type="module">
import { log } from './scripts/3-13.Module.js';
log("메세지 출력");
</script>
이렇게 script 태그에 type을 module로 지정하고, 필요한 함수를 import 해서 사용하시면 됩니다.
- 모듈을 삽입하는 방법에 대해,
<script>태그에 type을 “module”로 설정하신 경우에는import키워드를 사용하여 필요한 기능만을 선택적으로 가져올 수 있습니다. 반면, type을 “module”로 지정하지 않고, src 속성으로만 자바스크립트 파일을 연결한 경우에는 해당 스크립트 파일 전체가 하나의 전역 스코프로 실행됩니다. 그런데 모듈 시스템을 사용하는 경우에는 파일 별로 독립된 스코프를 가지므로, 모듈로 작성된 스크립트 파일은 다른 스크립트 태그에서 바로 사용할 수 없습니다. 모듈이 아닌 스크립트는 전역 변수를 통해 함수나 변수들을 사용할 수 있지만, 최근의 자바스크립트 개발에서는 모듈 시스템을 사용해 스코프를 분리하고 코드의 관리를 용이하게 하는 것이 일반적인 흐름입니다.
궁금증이 해결되셨길 바라며, 프로그래밍 학습에 더욱 도움이 되시기를 바랍니다. 강두희님, 언제든지 다른 궁금한 사항이 있으시면 질문해주세요. 감사합니다. 😊
외부 라이브러리 사용 질문
0
157
1
clearInterval, setInterval 질문
1
460
1
window 객체 질문 있습니다.
0
223
1
Date 함수 질문
0
290
1
Boolean 내장함수 강의 질문
0
323
1
4-04(마지막강의)에 있는 json으로 된 js파일은 어디에 있을까요?
0
412
1
Async Await 오류가 나서 문의드립니다.
0
566
2
선생님 안녕하세요. array내장함수 수업듣는중 이해가 안되는 부분이있어서 질문드립니다.
0
338
1
변수 관련 질문
0
288
1
Promis실습 도중의 에러메시지
0
450
2
moment.js cdn 외부 링크 오류
0
1468
1
64비트 부동소수점 내용 중
0
462
1
4-04 22분 15초에 나오는 61, 63 라인에 대해 질의드립니다.
0
253
1
64비트부동소수점 마지막부분 이해가 안가서요...
0
217
1
Chcekbox Element 값
0
228
1
parameter순서
0
468
1
parseInt parseFloat 질문
0
213
1
charAt 인덱스
0
219
0
STRING 결합
0
231
0
왜 오름차순으로 정렬되는지 궁금합니다.
0
246
1
HTML를 위한 자바스립트 4-01.HTML Element.html
0
349
1
함수 강의에서 8:47초 부분 질문 있습니다.
0
227
1
정규식 관련해서 질문이 있습니다.
1
310
2
module강의의 예제 코드를 사용하면 에러가 생겨서 질문드립니다.
0
375
1