File name
Commit message
Commit date
File name
Commit message
Commit date
import { createApp } from 'vue';
import AppRouter from './pages/AppRouter.js';
import App from './pages/App.vue';
import Store from './pages/AppStore.js';
import VueCookies from 'vue-cookies';
import { ApolloClient, InMemoryCache, createHttpLink } from '@apollo/client';
import { provideApolloClient } from '@vue/apollo-composable'; // @vue/apollo-composable 사용
const httpLink = createHttpLink({
uri: 'http://backend-example.codebootcamp.co.kr/graphql', // GraphQL 서버 주소
});
const apolloClient = new ApolloClient({
link: httpLink,
cache: new InMemoryCache(),
});
// Google API 스크립트 동적 로드 함수
function loadGapiScript() {
return new Promise((resolve, reject) => {
const script = document.createElement('script');
script.src = 'https://apis.google.com/js/api.js';
script.onload = resolve; // 로드 성공
script.onerror = reject; // 로드 실패
document.head.appendChild(script);
});
}
// Google API 로드 후 Vue 앱 초기화
async function initVueApp() {
try {
// gapi 스크립트를 로드합니다.
await loadGapiScript();
// gapi가 정상적으로 로드되었는지 확인합니다.
if (window.gapi) {
window.gapi.load('client:auth2', initVue); // Vue 앱 초기화 함수 호출
} else {
console.error('gapi is not defined');
}
} catch (error) {
console.error("Google API 로드 실패:", error);
}
}
// Vue 앱 초기화 함수
function initVue() {
const vueApp = createApp(App); // Vue 앱 인스턴스를 생성합니다.
vueApp
.use(AppRouter) // Vue Router 사용
.use(Store) // Vuex store 사용
.use(VueCookies) // VueCookies 사용
.config.globalProperties.$gapi = window.gapi; // gapi를 전역 속성으로 설정
// ApolloClient 제공
provideApolloClient(apolloClient); // Apollo Client를 Vue에 제공
// 쿠키 설정
vueApp.config.globalProperties.$cookies = VueCookies; // 쿠키 설정
vueApp.$cookies.config("1d"); // 쿠키 만료일 설정
vueApp.mount("#root"); // Vue 앱을 #root에 마운트
}
// 앱 초기화 함수 실행
initVueApp();