build: migrate the build tool from vue-cli to vite4 (#208)

src/graphql/fetch.ts

@@ -14,22 +14,18 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import axios, { AxiosResponse } from "axios";
+import type { AxiosResponse } from "axios";
+import axios from "axios";
 import { cancelToken } from "@/utils/cancelToken";
 
-async function query(param: {
-  queryStr: string;
-  conditions: { [key: string]: unknown };
-}) {
+async function query(param: { queryStr: string; conditions: { [key: string]: unknown } }) {
   const res: AxiosResponse = await axios.post(
     "/graphql",
     { query: param.queryStr, variables: { ...param.conditions } },
-    { cancelToken: cancelToken() }
+    { cancelToken: cancelToken() },
   );
   if (res.data.errors) {
-    res.data.errors = res.data.errors
-      .map((e: { message: string }) => e.message)
-      .join(" ");
+    res.data.errors = res.data.errors.map((e: { message: string }) => e.message).join(" ");
   }
   return res;
 }

src/graphql/fragments/alarm.ts

@@ -16,8 +16,7 @@
  */
 
 export const Alarm = {
-  variable:
-    "$keyword: String, $scope: Scope, $duration:Duration!, $tags:[AlarmTag], $paging: Pagination!",
+  variable: "$keyword: String, $scope: Scope, $duration:Duration!, $tags:[AlarmTag], $paging: Pagination!",
   query: `
     getAlarm(keyword: $keyword, scope: $scope, duration: $duration, paging: $paging, tags: $tags) {
       items: msgs {

src/graphql/fragments/ebpf.ts

@@ -33,8 +33,7 @@ export const createEBPFTask = {
   }`,
 };
 export const queryEBPFTasks = {
-  variable:
-    "$serviceId: ID, $serviceInstanceId: ID, $targets: [EBPFProfilingTargetType!]",
+  variable: "$serviceId: ID, $serviceInstanceId: ID, $targets: [EBPFProfilingTargetType!]",
   query: `
   queryEBPFTasks: queryEBPFProfilingTasks(serviceId: $serviceId, serviceInstanceId: $serviceInstanceId, targets: $targets) {
     taskId

src/graphql/fragments/topology.ts

@@ -53,8 +53,7 @@ export const EndpointTopology = {
   }`,
 };
 export const InstanceTopology = {
-  variable:
-    "$clientServiceId: ID!, $serverServiceId: ID!, $duration: Duration!",
+  variable: "$clientServiceId: ID!, $serverServiceId: ID!, $duration: Duration!",
   query: `
   topology: getServiceInstanceTopology(clientServiceId: $clientServiceId,
     serverServiceId: $serverServiceId, duration: $duration) {

src/graphql/index.ts

@@ -14,7 +14,8 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import axios, { AxiosPromise, AxiosResponse } from "axios";
+import type { AxiosPromise, AxiosResponse } from "axios";
+import axios from "axios";
 import { cancelToken } from "@/utils/cancelToken";
 import * as app from "./query/app";
 import * as selector from "./query/selector";
@@ -55,13 +56,11 @@ class Graphql {
           query: query[this.queryData],
           variables: variablesData,
         },
-        { cancelToken: cancelToken() }
+        { cancelToken: cancelToken() },
       )
       .then((res: AxiosResponse) => {
         if (res.data.errors) {
-          res.data.errors = res.data.errors
-            .map((e: { message: string }) => e.message)
-            .join(" ");
+          res.data.errors = res.data.errors.map((e: { message: string }) => e.message).join(" ");
         }
         return res;
       })

src/graphql/query/topology.ts

@@ -14,12 +14,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import {
-  InstanceTopology,
-  EndpointTopology,
-  ServicesTopology,
-  ProcessTopology,
-} from "../fragments/topology";
+import { InstanceTopology, EndpointTopology, ServicesTopology, ProcessTopology } from "../fragments/topology";
 
 export const getInstanceTopology = `query queryData(${InstanceTopology.variable}) {${InstanceTopology.query}}`;
 export const getEndpointTopology = `query queryData(${EndpointTopology.variable}) {${EndpointTopology.query}}`;

src/graphql/query/trace.ts

@@ -15,12 +15,7 @@
  * limitations under the License.
  */
 
-import {
-  Traces,
-  TraceSpans,
-  TraceTagKeys,
-  TraceTagValues,
-} from "../fragments/trace";
+import { Traces, TraceSpans, TraceTagKeys, TraceTagValues } from "../fragments/trace";
 
 export const queryTraces = `query queryTraces(${Traces.variable}) {${Traces.query}}`;