정리

src/App.vue

@@ -1,21 +0,0 @@
-<script setup lang="ts">
-// This starter template is using Vue 3 <script setup> SFCs
-// Check out https://vuejs.org/api/sfc-script-setup.html#script-setup
-import HelloWorld from './components/HelloWorld.vue'
-</script>
-
-<template>
-  <img alt="Vue logo" src="./assets/logo.png" />
-  <HelloWorld msg="Hello Vue 3 + TypeScript + Vite" />
-</template>
-
-<style>
-#app {
-  font-family: Avenir, Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  text-align: center;
-  color: #2c3e50;
-  margin-top: 60px;
-}
-</style>

src/components/HelloWorld.vue

@@ -1,52 +0,0 @@
-<script setup lang="ts">
-import { ref } from 'vue'
-
-defineProps<{ msg: string }>()
-
-const count = ref(0)
-</script>
-
-<template>
-  <h1>{{ msg }}</h1>
-
-  <p>
-    Recommended IDE setup:
-    <a href="https://code.visualstudio.com/" target="_blank">VS Code</a>
-    +
-    <a href="https://github.com/johnsoncodehk/volar" target="_blank">Volar</a>
-  </p>
-
-  <p>See <code>README.md</code> for more information.</p>
-
-  <p>
-    <a href="https://vitejs.dev/guide/features.html" target="_blank">
-      Vite Docs
-    </a>
-    |
-    <a href="https://v3.vuejs.org/" target="_blank">Vue 3 Docs</a>
-  </p>
-
-  <button type="button" @click="count++">count is: {{ count }}</button>
-  <p>
-    Edit
-    <code>components/HelloWorld.vue</code> to test hot module replacement.
-  </p>
-</template>
-
-<style scoped>
-a {
-  color: #42b983;
-}
-
-label {
-  margin: 0 0.5em;
-  font-weight: bold;
-}
-
-code {
-  background-color: #eee;
-  padding: 2px 4px;
-  border-radius: 4px;
-  color: #304455;
-}
-</style>

src/env.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="vite/client" />
-
-declare module '*.vue' {
-  import type { DefineComponent } from 'vue'
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
-  const component: DefineComponent<{}, {}, any>
-  export default component
-}

src/main.ts

@@ -1,4 +0,0 @@
-import { createApp } from 'vue'
-import App from './App.vue'
-
-createApp(App).mount('#app')

vite.config.ts

@@ -2,14 +2,22 @@ import { defineConfig, UserConfigExport } from "vite";
 import vue from "@vitejs/plugin-vue";
 import { resolve } from "node:path";
 import { map } from "lodash";
-import { existsSync, readFileSync } from "node:fs";
+import { existsSync, fstat, readFileSync } from "node:fs";
 
 type ExportKey = "ingame" | "ingame_vue";
 type BuildExports = Record<ExportKey, Record<string, string>>;
 
 // https://vitejs.dev/config/
-export default defineConfig(({ command, mode }) => {
-  const target = "hwe"; //방법이 있나?
+export default defineConfig(({ mode }) => {
+  const target = (()=>{
+    if(mode === "production" || mode === 'development'){
+      return "hwe";
+    }
+    if(existsSync(mode)){
+      return mode;
+    }
+    throw `invalid mode: ${mode}`;
+  })();
   const tsDir = resolve(__dirname, `${target}/ts/`);
 
   const build_exports: BuildExports = require(`${tsDir}/build_exports.json`);
@@ -51,11 +59,18 @@ export default defineConfig(({ command, mode }) => {
     resolve: {
       alias: {
         "@": tsDir,
-        "@scss": resolve(__dirname, `${target}/scss/`),
+        "@scss": `${target}/scss/`,
         "@util": resolve(tsDir, `util`),
       },
     },
     plugins: [vue()],
+    optimizeDeps: {
+      include: ['esm-dep > cjs-dep']
+    },
+    publicDir: false,
+    server: {
+      middlewareMode: "html",
+    }
   };
 
   return config;