反应打字稿中的 Npm @babel/types 错误

时间:2021-06-19 04:22:15

标签: reactjs npm electron npm-install npm-scripts

我收到以下类型错误。

我试过 npm install @types/babel_types 但没有解决。

我该如何修复它?我正在尝试为电子编译一个反应项目。

enter image description here

这是我的 package.json

{
    "name": "abc",
    "description": "abc",
    "author": "abc",
    "version": "1.4.11",
    "main": "public/electron.ts",
    "resolutions": {
        "apollo-client": "2.6.3"
    },
    "dependencies": {
        "@aws-amplify/cli": "^4.46.1",
        "@types/react": "^16.9.43",
        "@types/react-dom": "^16.9.8",
        "@types/react-modal": "^3.12.0",
        "@types/react-router-dom": "^5.1.7",
        "@types/socket.io-client": "^1.4.36",
        "@types/yup": "^0.29.11",
        "aws-amplify": "^3.3.26",
        "aws-amplify-react": "^4.2.30",
        "aws-appsync": "^4.0.3",
        "date-fns": "^2.22.1",
        "electron-is-dev": "^2.0.0",
        "electron-log": "^4.3.5",
        "electron-updater": "^4.3.9",
        "graphql-tag": "^2.12.4",
        "node-sass": "^4.14.1",
        "node-thermal-printer": "^4.1.2",
        "npm": "^6.14.7",
        "react": "^16.13.1",
        "react-apollo-hooks": "^0.4.5",
        "react-async": "^10.0.1",
        "react-axios": "^2.0.5",
        "react-dates": "^21.8.0",
        "react-dom": "^16.13.1",
        "react-load-script": "0.0.6",
        "react-modal": "^3.12.1",
        "react-router": "^5.2.0",
        "react-router-dom": "^5.2.0",
        "react-script-hook": "^1.4.1",
        "react-scripts": "^4.0.3",
        "react-toastify": "^7.0.4",
        "reshake": "^1.2.3",
        "save": "^2.4.0",
        "socket.io": "^4.1.2",
        "socket.io-client": "^4.1.2",
        "start": "^5.1.0",
        "styled-components": "^5.3.0",
        "typescript": "^3.9.7",
        "yup": "^0.32.9"
    },
    "scripts": {
        "start": "react-scripts start",
        "start:web": "react-scripts start",
        "build:web": "PUBLIC_URL=./ react-scripts build",
        "start:desktop": "npm run build:desktop && electron ./build/electron.js",
        "build:desktop": "tsc -p electron/tsconfig.json",
        "test": "react-scripts test",
        "eject": "react-scripts eject",
        "release": "electron-builder -mwl -p 'onTagOrDraft'",
        "release:windows": "electron-builder -w -p 'onTagOrDraft'",
        "electron-dev": "concurrently \"BROWSER=none npm run start\" \"wait-on http://localhost:3000 && electron .\""
    },
    "eslintConfig": {
        "extends": "react-app"
    },
    "devDependencies": {
        "concurrently": "^5.3.0",
        "electron": "^11.4.1",
        "electron-builder": "^22.11.7",
        "wait-on": "^5.2.1"
    },
    "build": {
        "appId": "com.tabin.desktop",
        "copyright": "Copyright 2021 Zeal Private Ltd",
        "publish": {
            "provider": "github"
        },
        "mac": {
            "category": "public.app-category.business",
            "icon": "build/icon.icns"
        },
        "win": {
            "icon": "build/icon.ico",
            "certificateFile": "private/electron-tabin-desktop-development.p12",
            "certificatePassword": "",
            "verifyUpdateCodeSignature": false
        },
        "linux": {
            "category": "Office",
            "icon": "build/icon.png"
        }
    },
    "browserslist": {
        "production": [
            ">0.2%",
            "not dead",
            "not op_mini all"
        ],
        "development": [
            "last 1 chrome version",
            "last 1 firefox version",
            "last 1 safari version"
        ]
    }
}


这是我的 tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react",
    "noFallthroughCasesInSwitch": true
  },
  "include": [
    "src",
    "electron/**/*"
  ]
}

请告诉我如何摆脱这个错误。我需要创建一些 .d.ts 文件吗?

谢谢,

1 个答案:

答案 0 :(得分:1)

首先,试试这个解决方案。 编辑您的 TypeScript 配置文件 (tsconfig.json) 并添加一个新的键值对

"noImplicitAny": false

如果这件事不起作用,那么这里有另外两个解决方案

当模块不属于您时 - 尝试安装来自 @types 的类型:

npm install -D @types/module-name

如果上述安装错误 - 尝试将导入语句更改为 require:

// import * as yourModuleName from 'module-name';
const yourModuleName = require('module-name');