Búsqueda de sitios web

paquete npm de TypeScript - cómo no tener que importar desde "dist/"

Estoy tratando de crear un paquete npm de utilidad. En mi directorio src tengo un montón de archivos typescript que declaran múltiples interfaces/tipos. Por ejemplo, en src/value-updatable.ts tengo:

export interface UnaryValueUpdatable<T> {
  value: T;
  onChange: (value: T) => void;
}

Compilo todo mi código fuente en dist/, porque es un paquete de utilidades no hay un archivo principal o de entrada, solo quiero usar los tipos en otros proyectos. Ni siquiera estoy seguro de si compilar es necesario, pero el problema sigue siendo el mismo. Cuando instalo el paquete en un proyecto diferente, tengo que importar desde dist/ o src/ en lugar de desde el nombre del paquete en sí.

Por ejemplo:

import {UnaryValueUpdatable} from "my-utility-package/dist/UnaryValueUpdatable"

¿Cómo tengo que configurar mi paquete para exponer rutas "bonitas" así: import {whatever} from "my-utility-package/whatever"?

package.json:

{
  "name": "my-utility-package",
  "version": "1.0.0",
  "files": [
    "dist/**/*"
  ],
  "scripts": {
    "build": "tsc"
  },
  "license": "MIT",
  "dependencies": {
    "typescript": "^3.6.4"
  }
}

tsconfig:

{
  "compilerOptions": {
    "target": "es5",
    "lib": ["dom", "dom.iterable", "esnext"],
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "commonjs",
    "outDir": "dist",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "declaration": true,
    "jsx": "react"
  },
  "include": ["src"],
  "exclude": ["dist"]
}

Respuesta #1

Puedes crear directorios en la raíz de tu proyecto que contengan package.jsons que apunten al directorio que deseas exponer en tu dist.

Puedes estructurar tu proyecto de la siguiente manera:

package.json (for entire project)
src
 | secondary-package-name
   |- index.ts
secondary-package-name
 |- package.json (for secondary-module-name)
dist
 |- generated files

el package.json de tu módulo secundario solo necesita contener

{
  "name": "package/secondary-package-name",
  "private": true,
  "main": "../dist/secondary-package-name/index.js"
}

apuntar de nuevo a tu dist

Entonces deberías poder referenciar las exportaciones del paquete secundario así:

import { someFn } from "package/secondary-package-name"

siempre que se exporte desde el archivo index.ts en ese directorio

También necesitarás asegurarte de que el campo files de tu archivo package.json principal incluya el nuevo directorio:

"files": [
  "dist",
  "secondary-package-name"
],

(originalmente respondido en https://stackoverflow.com/a/62482409/5574183)

Artículos relacionados