Ich habe das Bibliotheksmuster gemäß der Vite-Dokumentation verwendet und konnte eine funktionierende Komponentenbibliothek generieren.
Ich habe das Projekt mit der Voreinstellung vue-ts erstellt, die Requisiten und ihre Typen in meinen Komponenten definiert und einige Schnittstellen verwendet. Aber wenn ich die Bibliothek erstelle, sind keine Typen enthalten.
Wie füge ich Typen zum endgültigen Build hinzu, ob automatisch aus Komponenten abgeleitet oder manuell mithilfe von Definitionsdateien?
Weitere Informationen Hier finden Sie weitere Informationen zu meinen Dateien:
tsconfig.json
{ "name": "@mneelansh/test-lib", "private": false, "version": "0.0.2", "scripts": { "dev": "vite", "build": "vue-tsc --noEmit && vite build", "preview": "vite preview" }, "emitDeclarationOnly": true, // testing "declaration": true, // testing "main": "./dist/lib.umd.js", "module": "./dist/lib.es.js", "types": "./dist/main.d.ts", "exports": { ".": { "import": "./dist/lib.es.js", "require": "./dist/lib.umd.js" }, "./dist/style.css": "./dist/style.css" }, "files": [ "dist" ], "dependencies": { "@types/node": "^17.0.25", "vue": "^3.2.25" }, "devDependencies": { "@vitejs/plugin-vue": "^2.3.1", "typescript": "^4.5.4", "vite": "^2.9.5", "vue-tsc": "^0.34.7" } }
Ich habe das Attribut emitDeclarationOnly
和 declaration
hinzugefügt, aber das hat nicht geholfen.
Meinvite.config.ts
:
import { defineConfig } from "vite"; import vue from "@vitejs/plugin-vue"; const path = require("path"); // https://vitejs.dev/config/ export default defineConfig({ build: { lib: { entry: path.resolve(__dirname, "src/index.ts"), name: "Button", fileName: (format) => `lib.${format}.js`, }, rollupOptions: { external: ["vue"], output: { globals: { vue: "Vue", }, }, }, }, plugins: [vue()], });
我个人认为更好的方法是使用 vue-tsc:
请参阅https://stackoverflow.com/a/70343443/398287
您可以使用
vite-plugin-dts