컴포넌트 VUE 2(웹팩)에 외부 js 파일을 로드하는 방법

컴포넌트 VUE 2(웹팩)에 외부 js 파일을 로드하는 방법

나는 이미 찾아봤지만 찾을 수 없었다.외부 js 파일에서 url을 취득하여 index.html로 Import합니다.응용 프로그램이 시작될 때 파일이 로드되고 있습니다.

단, 사용자는 기능을 자주 사용하지 않으며 특정 컴포넌트가 호출되었을 때만 이 파일을 업로드하고 싶습니다.

템플릿 웹 팩과 함께 vue cli(vue 2)를 사용하고 있습니다.

저는 다음과 같은 시도를 해봤습니다.

import * as PagSeguroDirectPayment from 'https://stc.sandbox.pagseguro.uol.com.br/pagseguro/api/v2/checkout/pagseguro.directpayment.js';

required('https://stc.sandbox.pagseguro.uol.com.br/pagseguro/api/v2/checkout/pagseguro.directpayment.js');

그리고 그들은 작동하지 않는다.

결제 게이트웨이를 이용하려면 이 파일을 업로드해야 합니다. 누가 좀 도와주시겠어요?

index.html에서 사용하는 대신 별도의 js 파일을 만들고 링크에서 스크립트를 복사합니다.필요한 메서드를 js 파일로 내보내고 필요한 구성 요소로 가져옵니다.

이것은 vue가 가지고 있는 기능 중 하나이며, 이것이 매우 잘 고안되었다고 생각됩니다.그런 일을 하는 것은 사실 매우 쉽다.

제 루트에서는 다음과 같이 사용하고 있습니다.

// home gets loaded always
const Home = import('@/pages/home')

// profile and account gets loaded on demand
const Profile = () => import('@/pages/profile')
const Account = () => import('@/pages/account')

웹 팩과 함께 사용하면 각 컴포넌트에 대해 개별 파일이 생성됩니다.(01.js, 02.js 등) 이러한 파일은 필요에 따라 로드됩니다.

언급URL : https://stackoverflow.com/questions/47245132/how-to-load-external-js-file-in-my-component-vue-2-webpack