[ISSUES-1276]Upgrade some components of npm that the linkis console d…

…epends on (#4210)

* [ISSUES-1276]Upgrade some components of npm that the linkis console depends on

.github/workflows/build-frontend.yml

@@ -26,7 +26,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [14]
+        node-version: [16]
         # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
 
     steps:

linkis-computation-governance/linkis-engineconn/linkis-engineconn-core/src/main/scala/org/apache/linkis/engineconn/launch/EngineConnServer.scala

@@ -82,7 +82,7 @@ object EngineConnServer extends Logging {
       val ecHooks = EngineConnHook.getEngineConnHooks(onceMode)
       ecHooks.foreach(_.beforeCreateEngineConn(getEngineCreationContext))
       logger.info("Finished to execute hook of beforeCreateEngineConn.")
-      // 2. cresate EngineConn
+      // 2. create EngineConn
       val engineConn = getEngineConnManager.createEngineConn(getEngineCreationContext)
       logger.info(s"Finished to create ${engineConn.getEngineConnType} EngineConn.")
       ecHooks.foreach(_.beforeExecutionExecute(getEngineCreationContext, engineConn))

linkis-web/.eslintrc.js

@@ -5,90 +5,91 @@
  * The ASF licenses this file to You under the Apache License, Version 2.0
  * (the "License"); you may not use this file except in compliance with
  * the License.  You may obtain a copy of the License at
- * 
+ *
  *   http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-
 
 module.exports = {
-    root: true,
-    env: {
-        node: true
-    },
-    extends: [
-        'eslint:recommended',
-        'plugin:vue/essential'
+  root: true,
+  env: {
+    node: true
+  },
+  extends: [
+    'eslint:recommended',
+    'plugin:vue/essential'
+  ],
+  rules: {
+    'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
+    'key-spacing': ['error'],
+    'standard/no-callback-literal': 0,
+    'handle-callback-err': 0,
+    'no-return-assign': 0,
+    'eqeqeq': 0,
+    'comma-dangle': 0,
+    'semi': 0,
+    'space-before-function-paren': 0,
+    'keyword-spacing': 0,
+    'no-useless-escape': 0,
+    'operator-linebreak': 0,
+    'indent': [
+      'error',
+      2,
+      {
+        'SwitchCase': 1
+      }
     ],
-    rules: {
-        'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
-        'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
-        'key-spacing': ['error'],
-        'standard/no-callback-literal': 0,
-        'handle-callback-err': 0,
-        'no-return-assign': 0,
-        'eqeqeq': 0,
-        'comma-dangle': 0,
-        'semi': 0,
-        'space-before-function-paren': 0,
-        'keyword-spacing': 0,
-        'no-useless-escape': 0,
-        'operator-linebreak': 0,
-        'indent': [
-            'error',
-            2,
-            {
-                'SwitchCase': 1
-            }
-        ],
-        'no-const-assign': 'warn',
-        'no-this-before-super': 'warn',
-        "no-irregular-whitespace": 0,
-        'no-undef': 2,
-        'no-unreachable': 'warn',
-        'no-unused-vars': 2,
-        'constructor-super': 'warn',
-        'valid-typeof': 'warn',
-        'one-var': 'warn',
-        'max-len': 'off',
-        'no-trailing-spaces': 'off',
-        'require-jsdoc': 'warn',
-        'camelcase': 'warn',
-        'no-invalid-this': 'off',
-        'linebreak-style': 0,
-        'vue/no-parsing-error': [2, {
-            'x-invalid-end-tag': false,
-            'invalid-first-character-of-tag-name': false
-        }],
-        'no-tabs': 0,
-        'vue/html-indent': [2, 2, {
-            'attribute': 1,
-            'closeBracket': 0,
-            'alignAttributesVertically': false
-        }],
-        'vue/require-default-prop': 0,
-        'vue/component-name-in-template-casing': 0,
-        'vue/html-closing-bracket-spacing': 0,
-        'vue/html-closing-bracket-newline': 0,
-        'vue/singleline-html-element-content-newline': 0,
-        'vue/multiline-html-element-content-newline': 0,
-        'vue/attributes-order': 0,
-        'vue/html-self-closing': 0,
-        'no-useless-constructor': 0,
-        'no-mixed-operators': 0,
-        'no-new-func': 0,
-        'no-template-curly-in-string': 0,
-        'no-useless-call': 0,
-        "one-var": 0,
-        "camelcase": 0
-    },
-    parserOptions: {
-        "parser": 'babel-eslint',
-        "sourceType": "module"
-    }
+    'no-const-assign': 'warn',
+    'no-this-before-super': 'warn',
+    "no-irregular-whitespace": 0,
+    'no-undef': 2,
+    'no-unreachable': 'warn',
+    'no-unused-vars': 2,
+    'constructor-super': 'warn',
+    'valid-typeof': 'warn',
+    'max-len': 'off',
+    'no-trailing-spaces': 'off',
+    'require-jsdoc': 'warn',
+    'no-invalid-this': 'off',
+    'linebreak-style': 0,
+    'vue/no-parsing-error': [2, {
+      'x-invalid-end-tag': false,
+      'invalid-first-character-of-tag-name': false
+    }],
+    'no-tabs': 0,
+    'vue/html-indent': [2, 2, {
+      'attribute': 1,
+      'closeBracket': 0,
+      'alignAttributesVertically': false
+    }],
+    'vue/require-default-prop': 0,
+    'vue/component-name-in-template-casing': 0,
+    'vue/html-closing-bracket-spacing': 0,
+    'vue/html-closing-bracket-newline': 0,
+    'vue/singleline-html-element-content-newline': 0,
+    'vue/multiline-html-element-content-newline': 0,
+    'vue/attributes-order': 0,
+    'vue/html-self-closing': 0,
+    'no-useless-constructor': 0,
+    'no-mixed-operators': 0,
+    'no-new-func': 0,
+    'no-template-curly-in-string': 0,
+    'no-useless-call': 0,
+    // Rules below should be made open after refactoring front-end codes
+    "one-var": 0,
+    "camelcase": 0,
+    "vue/multi-word-component-names": "off",
+    "vue/no-reserved-component-names": "off",
+    "vue/no-mutating-props": "off"
+  },
+  parserOptions: {
+    "parser": 'babel-eslint',
+    "sourceType": "module"
+  }
 }

linkis-web/package.json

@@ -7,7 +7,8 @@
         "build": "vue-cli-service build",
         "lint": "vue-cli-service lint --no-fix",
         "fix": "eslint --ext .js,.vue src --fix",
-        "precommit": "lint-staged"
+        "precommit": "lint-staged",
+        "preinstall": "npm install --package-lock-only --ignore-scripts && npx npm-force-resolutions"
     },
     "husky": {
         "hooks": {
@@ -23,54 +24,59 @@
     },
     "dependencies": {
         "@form-create/iview": "2.5.27",
-        "axios": "0.19.2",
+        "axios": "^0.21.4",
         "babel-polyfill": "6.26.0",
-        "core-js": "2.6.11",
-        "dexie": "2.0.4",
-        "dt-sql-parser": "1.2.1",
-        "eslint": "6.8.0",
-        "eslint-plugin-vue": "6.2.2",
-        "highlight.js": "9.18.3",
+        "core-js": "3.27.2",
+        "dexie": "3.2.3",
+        "dt-sql-parser": "3.0.5",
+        "eslint": "7.21.0",
+        "eslint-plugin-vue": "9.6.0",
+        "highlight.js": "10.7.0",
         "iview": "3.5.4",
         "jsencrypt": "3.2.1",
-        "lodash": "4.17.20",
+        "lodash": "^4.17.21",
         "md5": "2.3.0",
         "mitt": "1.2.0",
-        "moment": "2.29.1",
-        "monaco-editor": "0.19.3",
+        "moment": "^2.29.4",
+        "monaco-editor": "0.30.1",
         "object-to-formdata": "4.2.2",
-        "qs": "6.9.4",
+        "path-browserify": "^1.0.1",
+        "qs": "^6.11.0",
         "reconnecting-websocket": "4.4.0",
         "sql-formatter": "2.3.3",
-        "svgo": "1.3.0",
+        "svgo": "^3.0.2",
         "v-jsoneditor": "1.4.5",
         "vue": "2.6.12",
         "vue-i18n": "8.22.1",
         "vue-router": "3.4.8",
         "vuedraggable": "2.24.3",
         "vuescroll": "4.16.1",
-        "worker-loader": "2.0.0"
+        "worker-loader": "3.0.8"
     },
     "devDependencies": {
-        "@kazupon/vue-i18n-loader": "0.4.1",
-        "@vue/cli-plugin-babel": "3.12.1",
-        "@vue/cli-plugin-eslint": "3.12.1",
-        "@vue/cli-service": "3.12.1",
+        "@intlify/vue-i18n-loader": "1.0.0",
+        "@vue/cli-plugin-babel": "^5.0.8",
+        "@vue/cli-plugin-eslint": "^5.0.8",
+        "@vue/cli-service": "^5.0.8",
         "@vue/eslint-config-standard": "4.0.0",
         "archiver": "3.1.1",
         "babel-eslint": "10.1.0",
-        "copy-webpack-plugin": "4.6.0",
-        "csp-html-webpack-plugin": "4.0.0",
-        "filemanager-webpack-plugin": "3.1.1",
+        "copy-webpack-plugin": "^9.1.0",
+        "csp-html-webpack-plugin": "5.1.0",
+        "filemanager-webpack-plugin": "^7.0.0",
         "husky": "1.3.1",
-        "lint-staged": "8.2.1",
+        "lint-staged": "^13.1.1",
         "material-design-icons": "3.0.1",
-        "monaco-editor-webpack-plugin": "1.8.2",
-        "node-sass": "4.14.1",
-        "sass-loader": "10.2.0",
-        "svg-sprite-loader": "5.0.0",
+        "monaco-editor-webpack-plugin": "6.0.0",
+        "node-sass": "^8.0.0",
+        "npm-force-resolutions": "^0.0.10",
+        "sass-loader": "^10.4.1",
+        "svg-sprite-loader": "6.0.0",
         "vue-cli-plugin-mockjs": "0.1.3",
         "vue-template-compiler": "2.6.12",
         "webpack-virtual-modules": "0.3.2"
+    },
+    "resolutions": {
+      "postcss": "7.0.36"
     }
 }

linkis-web/src/apps/URM/module/functionManagement/index.vue

@@ -5,9 +5,9 @@
   ~ The ASF licenses this file to You under the Apache License, Version 2.0
   ~ (the "License"); you may not use this file except in compliance with
   ~ the License.  You may obtain a copy of the License at
-  ~ 
+  ~
   ~   http://www.apache.org/licenses/LICENSE-2.0
-  ~ 
+  ~
   ~ Unless required by applicable law or agreed to in writing, software
   ~ distributed under the License is distributed on an "AS IS" BASIS,
   ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
@@ -105,9 +105,9 @@
       @on-visible-change="changUserModalChange"
     >
       <span>{{$t('message.linkis.udf.changeUserTo')}}</span>
-      <Select ref="userSelect" v-model="handleUser" filterable 
+      <Select ref="userSelect" v-model="handleUser" filterable
         v-if="allUsers.length"
-        :remoteMethod="filterSelect" 
+        :remoteMethod="filterSelect"
         @on-query-change="queryChange"
         :placeholder="$t('message.linkis.udf.inputUser')" style="width:200px;">
         <Option
@@ -203,7 +203,7 @@ export default {
   created() {
     // 获取函数类型
     // api.fetch('/configuration/engineType', 'get').then(res => {
-    //   console.log('res.engineType: ', res.engineType);
+    //   window.console.log('res.engineType: ', res.engineType);
     //   this.getFunctionTypes = ['all', ...res.engineType]
     // })
     // this.getFunctionTypes = ['all', '0', '1,2']
@@ -402,7 +402,7 @@ export default {
       this.loading = true
       const params = {
         udfUpdateVo: {
-          id: this.handleRow.id,	
+          id: this.handleRow.id,
           udfName: data.name,
           udfType: data.udfType,
           description: data.description,
@@ -412,7 +412,7 @@ export default {
           // sys: 'all',
           // clusterName: data.clusterName,
           // directory: data.directory
-        }	
+        }
       }
       api
         .fetch('/udf/update', params, 'post')
@@ -576,7 +576,7 @@ export default {
           this.search()
         })
         .catch(() => {
-      
+
         })
     },
     vlist(args) {
@@ -608,7 +608,7 @@ export default {
             this.search()
           })
           .catch(() => {
-        
+
           })
       }
     },
@@ -621,7 +621,7 @@ export default {
           this.search()
         })
         .catch(() => {
-      
+
         })
     },
     changeUser(args) {
@@ -651,7 +651,7 @@ export default {
             this.search()
           })
           .catch(() => {
-        
+
           })
       }
     },