ES6 모듈을 Chrome 확장 프로그램의 콘텐츠 스크립트로 성공적으로 가져오려면 어떻게 해야 합니까?

Chrome 확장 콘텐츠 스크립트에서 ES6 모듈 가져오기

문제: Chrome 63에서 콘텐츠의 가져오기/내보내기 구문을 사용하여 ES6 모듈을 가져옵니다. 스크립트 결과 구문 오류가 발생했습니다.

해결책:

Chrome 확장 프로그램은 비동기 동적 import() 함수를 통해 ES6 모듈을 지원합니다.

(async () => {
  const src = chrome.runtime.getURL("your/content_main.js");
  const contentMain = await import(src);
  contentMain.main();
})();

그러나 이 방법은 제한사항:

• 웹사이트 서비스에 의해 차단될 수 있습니다.
• 매니페스트의 웹 액세스 가능 리소스에서 가져온 스크립트를 선언해야 합니다.

모듈이 아닌 스크립트의 경우 다음을 고려하세요.

• 일반 비 -모듈 스크립트.
• 이전에 "content_scripts"의 "js"에 이름을 추가 주요 콘텐츠 스크립트.
• 전역 변수/함수를 직접 사용

추가 정보:

• [사용 방법 Chrome을 사용한 ES6 "가져오기" 확장 프로그램](https://stackoverflow.com/a/50132415)
• [Chrome에서 ES6 가져오기 작업 예 확장 프로그램](https://github.com/browsers-toolbox/es-import-in-extension)
• [chrome.runtime.getURL](https://developer.chrome.com/extensions/runtime #method-getURL)

위 내용은 ES6 모듈을 Chrome 확장 프로그램의 콘텐츠 스크립트로 성공적으로 가져오려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!