VUE 프로젝트에 GIO 통계 파일을 도입 할 때 '내보내기가 정의되지 않은'오류 가보고됩니다. 그것을 해결하는 방법?

VUE 프로젝트 소개 GIO 통계 파일 오류 보고서 "내보내기가 정의되지 않았다"솔루션

vue 2.6 프로젝트에 gio-alip.js 파일을 도입 할 때 exports is not defined , 이는 일반적으로 호환되지 않는 모듈 가져 오기 메소드로 인해 발생합니다. Vue는 기본적으로 ES6 모듈 시스템을 사용하지만 require 및 exports CommonJS 모듈 시스템의 기능입니다.

문제와 솔루션의 근본 원인 :

이 오류 프롬프트는 CommonJS의 require 및 exports 를 사용하여 코드를 가져오고 내보내려고합니다. 주로 해결책이 있습니다.

1. ES6 모듈을 사용하여 가져 오기 : 권장 솔루션이며 CommonJS가 Es6의 require import 로 직접 변경합니다.

   원래 코드를 넣으십시오.

    var gio = 요구 사항 ( "@/utils/gio-alip.js"). 기본값;
   Console.log (Gio);

   수정 :

    "@/utils/gio-alip.js"에서 gio를 가져옵니다.
   Console.log (Gio);

2. gio-alip.js 파일 수정 : gio-alip.js 파일 자체가 commonjs 사양을 사용하면 ES6 모듈 사양을 준수하도록 수정해야합니다. exports export default 또는 export 로 변경합니다.

   예를 들어, CommonJS 스타일 gio-alip.js 를 사용합니다.

    // gio-alip.js (commonjs)
   const gio = { /* content* /};
   module.exports = gio;

   ES6 스타일로 수정 :

    // gio-alip.js (es6)
   const gio = { /* content* /};
   수출 기본 GIO; // 또는 내보내기 const gio = {/* content*/};

3. Babel 구성 (권장되지 않음) : 위의 방법 중 어느 것도 해결할 수없고 CommonJS의 gio-alip.js 파일을 유지 해야하는 경우 @babel/plugin-transform-modules-commonjs 플러그인을 Babel 구성 파일 ( .babelrc 또는 babel.config.js )에 추가 할 수 있습니다. 그러나 이것은 프로젝트의 복잡성을 높이고 ES6 모듈 가져 오기가보다 현대적이고 권장되는 방법이기 때문에 일반적으로 모범 사례가 아닙니다. 구성 예 :

    {
     "플러그인": [ ""@babel/플러그인 변환 모듈-코몬 제 "]]]
   }

요약 :

메소드 1 및 2에 우선 순위가 부여되며 ES6 모듈 가져 오기 메소드를 직접 사용하고 gio-alip.js 파일도 ES6 모듈을 사용하여 내보내도록 확인하십시오. 바벨은 gio-alip.js 수정하는 것이 실제로 불가능한 경우에만 호환성으로 간주되지만 코드의 가독성과 유지 보수를 줄이기 때문에 권장되지 않습니다. gio-alip.js 파일 컨텐츠가 프로젝트 환경과 정확하고 호환되는지 확인하십시오.

위 내용은 VUE 프로젝트에 GIO 통계 파일을 도입 할 때 '내보내기가 정의되지 않은'오류 가보고됩니다. 그것을 해결하는 방법?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!