我的 npm package 没有 Typescript 在安装时需要一个声明文件

Question

我发表了超基本的npm package。 我计划发布我的一些 React 组件，但我从一个非常简单的 package 作为测试开始。 安装成功，但是当我将一个模块导入另一个项目时，有一个声明警告。

该模块在新项目中工作并呈现，但它有以下错误消息：“找不到模块'skylight-react'的声明文件。'/Users/{my-name}/{project-root}/node_modules /skylight-react/dist/index.js' 隐式具有“任何”类型。尝试npm install @types/skylight-react （如果存在）或添加包含declare module 'skylight-react';的新声明（.d.ts）文件declare module 'skylight-react'; ts(7016)"

我写的 package (skylight-react) 是在没有 Typescript 的情况下写的。 package.json如下：

{
  "name": "skylight-react",
  "version": "0.3.0",
  "private": false,
  "main": "dist/index",
  "module": "dist/index",
  "typings": "dist/index",
  "files": [ "dist", "README.md" ],
  "repository": {
    "type": "git",
    "url": "git+https://github.com/jawblia/components.git"
  },
  "dependencies": {
    "@testing-library/jest-dom": "^5.11.4",
    "@testing-library/react": "^11.1.0",
    "@testing-library/user-event": "^12.1.10",
    "web-vitals": "^1.0.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build-examples": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "build": "rm -rf dist && NODE_ENV=production babel src/lib --out-dir dist --copy-files --ignore __tests__,spec.js,test.js,__snapshots__"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-scripts": "4.0.3",
    "@babel/cli": "^7.13.14",
    "@babel/core": "^7.13.14",
    "@babel/preset-env": "^7.13.12"
  }
}

.babelrc是

{
  "presets": ["@babel/preset-env", "@babel/preset-react"]
}

我发布的 package 和我导入的项目都没有使用 Typescript。 任何帮助都非常感谢！！！

Answer 1

更改您的package.json条目以包含扩展名并且是相对的。 ./dist/index.d.ts必须存在，如果不存在，则将组件写入 TypeScript 并在您的tsconfig.json中使用declaration: true或自行声明类型。

此外，不要在未在本地测试并设置.gitignore和.npmignore的情况下发布包。 我建议您在发布到 npm 之前阅读本指南和本指南。

{
  ...
  "main": "./dist/index.js",
  "module": "./dist/index.js",
  "typings": "./dist/index.d.ts"
  ...
}