먼저, Parcel은 자바스크립트 프로젝트를 번들링하는 도구로, 모듈 번들러입니다. 웹 카메라를 사용하려면 웹 브라우저에서 제공하는 navigator.mediaDevices.getUserMedia API를 사용해야 합니다.

// web-camera.js
async function showCamera() {
  try {
    const stream = await navigator.mediaDevices.getUserMedia({ video: true });

    const videoElement = document.createElement("video");
    videoElement.srcObject = stream;
    document.body.appendChild(videoElement);
    videoElement.play();
  } catch (error) {
    console.error("Error accessing camera", error);
  }
}

showCamera();

위의 예제 코드에서 getUserMedia 함수는 콜백 없이 프로미스를 반환합니다. 이를 사용하여 사용자의 웹 카메라에 액세스하고, 웹 카메라 스트림을 가져와 새로운 video 요소에 할당합니다. 그리고 이 요소를 웹 페이지에 추가하고 재생합니다.

Parcel을 사용하여 위의 예제 코드를 번들링하려면 아래와 같이 터미널에서 명령어를 실행합니다.

$ parcel index.html

위의 명령어는 index.html 파일을 실행하고, Parcel이 자동으로 종속성을 해결하고 번들링된 자바스크립트 파일을 생성합니다.

웹 브라우저에서 index.html 파일을 열면, 웹 카메라가 사용되어 영상이 보여질 것입니다. 카메라에 액세스 권한을 허용해주어야 영상이 정상적으로 표시될 수 있습니다.

더 자세한 내용은 Parcel 공식 문서와 MDN 웹 문서를 참고해주세요.