我依照 vite 文件使用庫(kù)模式,並且能夠產(chǎn)生一個(gè)工作元件庫(kù)。
我使用 vue-ts 預(yù)設(shè)創(chuàng)建了項(xiàng)目,並在我的元件中定義了道具及其類型,並使用了一些介面。但是當(dāng)我建立庫(kù)時(shí),沒有包含任何類型。
如何為最終建置新增類型,無(wú)論是自動(dòng)從元件推斷還是使用定義檔手動(dòng)推斷?
更多資訊 以下是有關(guān)我的文件的更多資訊:
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" } }
我新增了 emitDeclarationOnly
和 declaration
屬性,但這沒有幫助。
我的vite.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()], });
我個(gè)人認(rèn)為更好的方法是使用 vue-tsc:
vue-tsc --declaration --emitDeclarationOnly#
您可以使用vite-plugin-dts
import dts from "vite-plugin-dts"; export default defineConfig({ plugins: [ dts({ insertTypesEntry: true, }), ],