UMD Vue build

.changeset/grumpy-actors-attend.md

@@ -0,0 +1,5 @@
+---
+'@number-flow/vue': patch
+---
+
+Use UMD for CJS build (see #88)

packages/vue/package.json

@@ -1,5 +1,6 @@
 {
 	"name": "@number-flow/vue",
+	"type": "module",
 	"publishConfig": {
 		"access": "public"
 	},
@@ -32,14 +33,14 @@
 		"dist",
 		"README.md"
 	],
-	"main": "./dist/index.js",
-	"module": "./dist/index.mjs",
+	"main": "./dist/index.umd.cjs",
+	"module": "./dist/index.js",
 	"types": "./dist/index.d.ts",
 	"exports": {
 		".": {
 			"types": "./dist/index.d.ts",
-			"import": "./dist/index.mjs",
-			"require": "./dist/index.js"
+			"import": "./dist/index.js",
+			"require": "./dist/index.umd.cjs"
 		}
 	},
 	"scripts": {

packages/vue/vite.config.mjs

@@ -23,16 +23,24 @@ export default defineConfig(({ mode }) => ({
 	build: {
 		outDir,
 		lib: {
-			entry: resolve(__dirname, 'src/index.ts'),
-			formats: ['es', 'cjs'],
-			fileName: 'index'
+			name: 'number-flow-vue', // required for UMD build
+			entry: {
+				index: resolve(__dirname, 'src/index.ts')
+			},
+			fileName: (format, name) => {
+				return `${name}.${format === 'es' ? 'js' : 'umd.cjs'}`
+			}
 		},
 		rollupOptions: {
 			external: ['vue', 'number-flow', 'esm-env'],
 			output: {
+				// Names for UMD builds
 				globals: {
-					vue: 'Vue'
-				}
+					vue: 'Vue',
+					'esm-env': 'Env',
+					'number-flow': 'NumberFlow'
+				},
+				exports: 'named'
 			}
 		}
 	}