Vue3.0中ts引入支持js问题

tsconfig.json中

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "strict": false, //默认true
    "jsx": "preserve",
    "moduleResolution": "node",
    "experimentalDecorators": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowJs": true,// ts支持js
    "outDir": "./",// ts支持js，将输出结构重定向到目录。
    "allowSyntheticDefaultImports": true,
    "forceConsistentCasingInFileNames": true,
    "useDefineForClassFields": true,
    "sourceMap": true,
    "baseUrl": ".",
    "types": [
      "webpack-env"
    ],
    "paths": {
      "@/*": [
        "src/*"
      ]
    },
    "typeRoots":[
      "./types",
      "./node_modules/vue/types"
    ],
    "lib": [
      "esnext",
      "dom",
      "dom.iterable",
      "scripthost"
    ]
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "tests/**/*.ts",
    "tests/**/*.tsx",
    "src/**/*.js" //ts支持js
  ],
  "exclude": [
    "node_modules",
    "dist"
  ]
}

Vue.config.js

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  lintOnSave: false, // 关闭语法检查

/*
  // 方式一
  // 开启代理服务器：端口5000
  // 弊端1：不能配置多个代理，只能唯一
  // 弊端2：请求本地无时，才走代理服务器
  /!*devServer:{
    proxy:"http://localhost:5000"
  },*!/
  // 方式二: 官网devServer.proxy中
  // 更多的代理控制行为
  devServer: {
    proxy: {
      // 代理1：正常写法
      // 注：使用一个 path: options 成对的对象 重点
      // ‘/api’前缀：可自定义
      '/atguigu': {//匹配所有以’/atguigu‘开头的请求路径
        target: 'http://localhost:5000', // 代理目标的基础路径
        pathRewrite: {'^/atguigu':''},// 重写路径：{key'匹配所有^/atguigu : value为'空'}
        ws: true, // 用于支持websocket
        // 用于控制请求头中的host值
        changeOrigin: true // 来自于路径：ture为5000请求服务器端口一致，false默认为8080真实端口
      },
      '/demo': {
        target: 'http://localhost:5001',
        // 重写路径：{key'匹配所有^/atguigu : value为'空'}
        pathRewrite: {'^/demo':''},
        ws: true, // 用于支持websocket
        // 用于控制请求头中的host值
        changeOrigin: true // 来自于路径：false为5000请求服务器端口一致，true为8080真实端口
      },
      // 代理2：精简写法
      '/foo': {
        target: '<other_url>'
      }
    }
  }
*/

})

shims-vue.d.ts

declare module '*.vue' {
  import Vue from 'vue'
  export default Vue
  //增加ts引入js
  /*import { DefineComponent } from "vue"
  const component: DefineComponent<{}, {}, any>
  export default component*/
  declare module '@'

}