콘솔찍은건 잘 뜨는데 콘솔이 알랏으로 변경되지 않습니다

프론트엔드 개발환경의 이해와 실습 (webpack, babel, eslint..)

로더

작성

298

module.exports = function myWebpackLoader (content){

    console.log("실행");

    return content.replace('console.log(','alert(');

}

으로 빌드하면 실행 콘솔 찍은것 2번 나오고

[webpack-cli] Compilation finished뜹니다

npx lite-server로 서버 구동하여 확인하면

알랏이 안뜨고 콘솔로 3이 뜹니다

일부러

module.exports = function myWebpackLoader (content){

    console.log("실행");

    return content.replace('console','alert(');

}

이런식으로 콘솔글자를 바꿔서 빌드하면

You may need an additional loader to handle the result of these loaders. | import * as math from './math.js'; > alert(.log(math.sum(1,2));

라는 에러가 뜹니다

replace가 동작을 하는것 같긴 한데

왜 콘솔을 알랏으로 바꾸지 못하는것일까요?

답변 5

덕분에 해결됐습니다. 감사합니다!

저도 같은 문제로 고생했는데 해결방법을 찾아 공유합니다

아마도 주석으로 이전의 console.log를 예제와 다르게 작성해두신게 있어서 그런거 같습니다

replace는 하나만 console.log를 alert으로 바꾸는데

replaceAll로 하면 모두 바꿔버려서 문제가 해결되는거 같습니다.

참고하셔서 강의 들으시는데 도움 되셨으면 좋겠습니다.

지식공유자

해결되어서 다행이네요

질문자

원인은 찾지 못했으나 다시 작성하고 시도하니 잘 됩니다 ㅠㅠ 답변 감사합니다

지식공유자

말씀하신대로 로더가 동작해서 코드를 변경하는 것 같긴하네요. 근데 마지막에 lite-server로 구동하시는 부분이 좀 의심스럽습니다. lite-server가 응답해주는 index.html과 자바스크립트 파일이 로더로 변경한 것인지 확인해 보시겠어요?

인프런 커뮤니티 질문&답변