diff --git a/frontend/package.json b/frontend/package.json
index b83920afa..3e2060106 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -41,7 +41,7 @@
         "highlight.js": "^11.9.0",
         "js-base64": "^3.7.7",
         "md-editor-v3": "^2.11.3",
-        "monaco-editor": "^0.34.1",
+        "monaco-editor": "^0.51.0",
         "nprogress": "^0.2.0",
         "pinia": "^2.1.7",
         "pinia-plugin-persistedstate": "^1.6.1",
diff --git a/frontend/src/views/host/file-management/code-editor/index.vue b/frontend/src/views/host/file-management/code-editor/index.vue
index ca0676ec9..b7911933d 100644
--- a/frontend/src/views/host/file-management/code-editor/index.vue
+++ b/frontend/src/views/host/file-management/code-editor/index.vue
@@ -67,7 +67,7 @@
         </div>
         <div v-loading="loading">
             <div class="flex">
-                <div class="sm:w-48 w-1/3 monaco-editor-background tree-container" v-if="isShow">
+                <div class="monaco-editor sm:w-48 w-1/3 monaco-editor-background border-0 tree-container" v-if="isShow">
                     <div class="flex items-center justify-between pl-1 sm:pr-4 pr-1 pt-1">
                         <el-tooltip :content="$t('file.top')" placement="top">
                             <el-text size="small" @click="getUpData()" class="cursor-pointer">
@@ -711,6 +711,11 @@ defineExpose({ acceptParams });
     color: var(--el-color-primary) !important;
 }
 
+.monaco-editor-background {
+    outline-style: none;
+    background-color: var(--vscode-editor-background) !important;
+}
+
 .tree-widget {
     background-color: var(--el-button--primary);
 }