로컬, 개발 실행설정 변경

This commit is contained in:
nevermoregb 2025-02-27 11:37:51 +09:00
parent bd91e0a72d
commit 4e75c988de
6 changed files with 122 additions and 107 deletions

View File

@ -1,6 +1,6 @@
VITE_DOMAIN = http://localhost:5173/ VITE_DOMAIN = https://192.168.0.251:5173/
# VITE_LOGIN_URL = http://localhost:10325/ms/ # VITE_LOGIN_URL = http://localhost:10325/ms/
# VITE_FILE_URL = http://localhost:10325/ms/ # VITE_FILE_URL = http://localhost:10325/ms/
# VITE_API_URL = http://localhost:10325/api/ VITE_API_URL = https://192.168.0.251:10325/api/
VITE_API_URL = http://localhost:10325/test/ VITE_TEST_URL = https://192.168.0.251:10325/test/
VITE_KAKAO_MAP_KEY=6f092e8f45ee81186bb6d8408f66a492 VITE_KAKAO_MAP_KEY=6f092e8f45ee81186bb6d8408f66a492

6
.env.mine Normal file
View File

@ -0,0 +1,6 @@
VITE_DOMAIN = http://localhost:5173/
# VITE_LOGIN_URL = http://localhost:10325/ms/
# VITE_FILE_URL = http://localhost:10325/ms/
VITE_API_URL = http://localhost:10325/api/
VITE_TEST_URL = http://localhost:10325/test/
VITE_KAKAO_MAP_KEY=6f092e8f45ee81186bb6d8408f66a492

View File

@ -1,50 +1,51 @@
{ {
"name": "front", "name": "front",
"version": "0.0.1", "version": "0.0.1",
"private": true, "private": true,
"type": "module", "type": "module",
"scripts": { "scripts": {
"dev": "vite --host 0.0.0.0 --mode dev", "dev": "vite --host 0.0.0.0 --mode dev",
"build": "vite build --mode prod", "mine": "vite --host 0.0.0.0 --mode mine",
"preview": "vite preview", "build": "vite build --mode prod",
"lint": "eslint . --fix", "preview": "vite preview",
"format": "prettier --write src/" "lint": "eslint . --fix",
}, "format": "prettier --write src/"
"dependencies": { },
"@fullcalendar/core": "^6.1.15", "dependencies": {
"@fullcalendar/daygrid": "^6.1.15", "@fullcalendar/core": "^6.1.15",
"@fullcalendar/interaction": "^6.1.15", "@fullcalendar/daygrid": "^6.1.15",
"@fullcalendar/vue3": "^6.1.15", "@fullcalendar/interaction": "^6.1.15",
"@popperjs/core": "^2.11.8", "@fullcalendar/vue3": "^6.1.15",
"@tinymce/tinymce-vue": "^5.1.1", "@popperjs/core": "^2.11.8",
"@vueup/vue-quill": "^1.2.0", "@tinymce/tinymce-vue": "^5.1.1",
"axios": "^1.7.9", "@vueup/vue-quill": "^1.2.0",
"bootstrap": "^5.3.3", "axios": "^1.7.9",
"bootstrap-icons": "^1.11.3", "bootstrap": "^5.3.3",
"dayjs": "^1.11.13", "bootstrap-icons": "^1.11.3",
"dompurify": "^3.2.3", "dayjs": "^1.11.13",
"flatpickr": "^4.6.13", "dompurify": "^3.2.3",
"front": "file:", "flatpickr": "^4.6.13",
"heic2any": "^0.0.4", "front": "file:",
"pinia": "^2.2.6", "heic2any": "^0.0.4",
"pinia-plugin-persist": "^1.0.0", "pinia": "^2.2.6",
"quill": "^2.0.3", "pinia-plugin-persist": "^1.0.0",
"upload-images-converter": "^2.0.2", "quill": "^2.0.3",
"vite-plugin-mkcert": "^1.17.6", "upload-images-converter": "^2.0.2",
"vue": "^3.5.13", "vite-plugin-mkcert": "^1.17.6",
"vue-flatpickr-component": "^11.0.5", "vue": "^3.5.13",
"vue-router": "^4.4.5", "vue-flatpickr-component": "^11.0.5",
"vue3-kakao-maps": "^2.3.10" "vue-router": "^4.4.5",
}, "vue3-kakao-maps": "^2.3.10"
"devDependencies": { },
"@eslint/js": "^9.14.0", "devDependencies": {
"@vitejs/plugin-vue": "^5.2.1", "@eslint/js": "^9.14.0",
"@vue/eslint-config-prettier": "^10.1.0", "@vitejs/plugin-vue": "^5.2.1",
"eslint": "^9.14.0", "@vue/eslint-config-prettier": "^10.1.0",
"eslint-plugin-vue": "^9.30.0", "eslint": "^9.14.0",
"prettier": "^3.3.3", "eslint-plugin-vue": "^9.30.0",
"vite": "^5.4.10", "prettier": "^3.3.3",
"vite-plugin-inspect": "^0.8.9", "vite": "^5.4.10",
"vite-plugin-vue-devtools": "^7.6.5" "vite-plugin-inspect": "^0.8.9",
} "vite-plugin-vue-devtools": "^7.6.5"
}
} }

View File

@ -3,7 +3,7 @@ import { useRoute } from 'vue-router';
import { useToastStore } from '@s/toastStore'; import { useToastStore } from '@s/toastStore';
const $api = axios.create({ const $api = axios.create({
baseURL: 'https://192.168.0.251:10325/api/', baseURL: import.meta.env.VITE_API_URL,
timeout: 300000, timeout: 300000,
withCredentials: true, withCredentials: true,
}); });

View File

@ -8,9 +8,8 @@
<div class="navbar-nav-right d-flex align-items-center" id="navbar-collapse"> <div class="navbar-nav-right d-flex align-items-center" id="navbar-collapse">
<ul class="navbar-nav flex-row align-items-center ms-auto"> <ul class="navbar-nav flex-row align-items-center ms-auto">
<button class="btn p-1" @click="switchToLightMode"><i class="bx bxs-sun link-warning"></i></button>
<button class="btn p-1" @click="switchToLightMode"><i class='bx bxs-sun link-warning'></i></button> <button class="btn p-1" @click="switchToDarkMode"><i class="bx bxs-moon"></i></button>
<button class="btn p-1" @click="switchToDarkMode"><i class='bx bxs-moon' ></i></button>
<i class="bx bx-bell bx-md bx-log-out cursor-pointer p-1" @click="handleLogout"></i> <i class="bx bx-bell bx-md bx-log-out cursor-pointer p-1" @click="handleLogout"></i>
@ -152,7 +151,13 @@
<!-- User --> <!-- User -->
<li class="nav-item navbar-dropdown dropdown-user dropdown"> <li class="nav-item navbar-dropdown dropdown-user dropdown">
<a class="nav-link dropdown-toggle hide-arrow p-0" href="javascript:void(0);" data-bs-toggle="dropdown"> <a class="nav-link dropdown-toggle hide-arrow p-0" href="javascript:void(0);" data-bs-toggle="dropdown">
<img v-if="user" :src="`${baseUrl}upload/img/profile/${user.profile}`" alt="Profile Image" class="w-px-40 h-px-40 rounded-circle" @error="$event.target.src = '/img/icons/icon.png'"/> <img
v-if="user"
:src="`${baseUrl}upload/img/profile/${user.profile}`"
alt="Profile Image"
class="w-px-40 h-px-40 rounded-circle"
@error="$event.target.src = '/img/icons/icon.png'"
/>
</a> </a>
<ul class="dropdown-menu dropdown-menu-end"> <ul class="dropdown-menu dropdown-menu-end">
<li> <li>
@ -227,40 +232,37 @@
</nav> </nav>
</template> </template>
<script setup> <script setup>
import { useAuthStore } from '@s/useAuthStore'; import { useAuthStore } from '@s/useAuthStore';
import { useUserInfoStore } from '@/stores/useUserInfoStore'; import { useUserInfoStore } from '@/stores/useUserInfoStore';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import { useThemeStore } from '@s/darkmode'; import { useThemeStore } from '@s/darkmode';
import { onMounted, ref } from 'vue'; import { onMounted, ref } from 'vue';
import $api from '@api'; import $api from '@api';
const user = ref(null); const user = ref(null);
const baseUrl = $api.defaults.baseURL.replace(/api\/$/, ''); //const baseUrl = $api.defaults.baseURL.replace(/api\/$/, '');
const baseUrl = import.meta.env.BASE_URL;
const authStore = useAuthStore(); const authStore = useAuthStore();
const userStore = useUserInfoStore(); const userStore = useUserInfoStore();
const router = useRouter(); const router = useRouter();
const { isDarkMode, switchToDarkMode, switchToLightMode } = useThemeStore(); const { isDarkMode, switchToDarkMode, switchToLightMode } = useThemeStore();
onMounted(async () => { onMounted(async () => {
if (isDarkMode) { if (isDarkMode) {
switchToDarkMode(); switchToDarkMode();
} else { } else {
switchToLightMode(); switchToLightMode();
} }
await userStore.userInfo();
user.value = userStore.user;
});
const handleLogout = async () => {
await authStore.logout();
router.push('/login');
};
await userStore.userInfo();
user.value = userStore.user;
});
const handleLogout = async () => {
await authStore.logout();
router.push('/login');
};
</script> </script>
<style></style> <style></style>

View File

@ -5,27 +5,33 @@ import vueDevTools from 'vite-plugin-vue-devtools';
import mkcert from 'vite-plugin-mkcert'; import mkcert from 'vite-plugin-mkcert';
// https://vite.dev/config/ // https://vite.dev/config/
export default defineConfig({ export default defineConfig(({ mode }) => {
plugins: [ const plugins = [vue(), vueDevTools()];
vue(),
vueDevTools(), // dev: https, mine: http
// 자신의 로컬 서버에 연결하려면 이부분 주석처리 if (mode === 'dev') {
mkcert({ plugins.push(
// SSL 키 등록 mkcert({
keyFile: '/localhost-key.pem', // SSL 키 등록
certFile: '/localhost.pem', keyFile: '/localhost-key.pem',
}), certFile: '/localhost.pem',
], }),
resolve: { );
alias: { }
'@': fileURLToPath(new URL('./src', import.meta.url)),
'@a': fileURLToPath(new URL('./src/assets/', import.meta.url)), return {
'@c': fileURLToPath(new URL('./src/components/', import.meta.url)), plugins,
'@v': fileURLToPath(new URL('./src/views/', import.meta.url)), resolve: {
'@l': fileURLToPath(new URL('./src/layout/', import.meta.url)), alias: {
'@s': fileURLToPath(new URL('./src/stores/', import.meta.url)), '@': fileURLToPath(new URL('./src', import.meta.url)),
'@p': fileURLToPath(new URL('./src/common/plugin/', import.meta.url)), '@a': fileURLToPath(new URL('./src/assets/', import.meta.url)),
'@api': fileURLToPath(new URL('./src/common/axios-interceptor.js', import.meta.url)), '@c': fileURLToPath(new URL('./src/components/', import.meta.url)),
'@v': fileURLToPath(new URL('./src/views/', import.meta.url)),
'@l': fileURLToPath(new URL('./src/layout/', import.meta.url)),
'@s': fileURLToPath(new URL('./src/stores/', import.meta.url)),
'@p': fileURLToPath(new URL('./src/common/plugin/', import.meta.url)),
'@api': fileURLToPath(new URL('./src/common/axios-interceptor.js', import.meta.url)),
},
}, },
}, };
}); });