I have a simple vite reactjs component library with the following interface that is imported and used from other pages.
src/dtos/dtos.ts
export interface User {}
export interface Document {}
src/contexts/mainContext.ts
import { User, Document } from "../dtos/dtos";
and other areas as well.
now in src/index.ts I did exports:
export type { User, Document } from "./dtos/dtos";
export { mainContext } from "./contexts/MainContexts"
when I do vite build now, in dist/index.d.ts, I see User, User_2, Document and Document_2. it does generate es and umd files in /dist.
What could be causing the duplicate?
tsconfig.json
{
"compilerOptions": {
"target": "ES2020",
"useDefineForClassFields": true,
"lib": ["ES2020"],
"module": "ESNext",
"skipLibCheck": true,
"declaration": true,
//"declarationMap": true,
"paths": {
"@dtos/*": ["./src/dtos/*"],
"@contexts/*": ["./src/contexts/*"],
},
/* Bundler mode */
"moduleResolution": "bundler",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": false,
"jsx": "react-jsx",
"noImplicitAny": false,
/* Linting */
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true
},
"include": ["src", "dist/index.d.ts"],
"references": [{ "path": "./tsconfig.node.json" }]
}
tsconfig.node.json
{
"compilerOptions": {
"composite": true,
"module": "ESNext",
"moduleResolution": "Node",
"allowSyntheticDefaultImports": true,
"resolveJsonModule": true,
},
"include": ["vite.config.ts","package.json"],
}
vite.config.ts
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import dts from 'vite-plugin-dts'
import tsconfigPaths from "vite-tsconfig-paths";
import * as packageJson from './package.json'
import { resolve } from "node:path";
// https://vitejs.dev/config/
export default defineConfig({
plugins: [
react(),
tsconfigPaths(),
dts({
insertTypesEntry: true,
rollupTypes: true,
}),
],
resolve: {
alias: {
"@dtos/*": "./src/dtos/*",
"@contexts/*": "./src/contexts/*",
},
},
build: {
lib: {
entry: resolve('src', 'index.ts'),
name: 'App',
formats: ['es', 'umd'],
fileName: (format) => `app.${format}.js`,
},
rollupOptions: {
external: [...Object.keys(packageJson.peerDependencies),
"react"],
output: {
globals: {
react: "React"
},
},
},
sourcemap: true,
emptyOutDir: true,
},
})
package.json
{
"name": "@saus/app",
"version": "0.0.1",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
"preview": "vite preview",
"test": "jest --config=jest.config.cjs"
},
"files": [
"dist"
],
"exports": {
".": {
"import": "./dist/app.es.js",
"require": "./dist/app.umd.js",
"types": "./dist/index.d.ts"
},
"./dist/index.d.ts": "./dist/index.d.ts"
},
"main": "./dist/app.umd.js",
"module": "./dist/app.es.js",
"types": "./dist/index.d.ts",
"peerDependencies": {
"react": "^18.0.0"
},
"devDependencies": {}
}