package: Migrate build to vite

https://vite.dev/guide/build.html#library-mode
https://rbardini.com/how-to-build-ts-library-with-vite/

Author: simon04

.gitignore

@@ -2,6 +2,5 @@ bundle.js
 demo-*/package-lock.json
 demo-*/dist/
 dist/*
-!dist/Control.Geocoder.css
 docs/
 node_modules/

package-lock.json

@@ -2,24 +2,37 @@
   "name": "leaflet-control-geocoder",
   "version": "2.4.0",
   "description": "Extendable geocoder with builtin support for OpenStreetMap Nominatim, Bing, Google, Mapbox, MapQuest, What3Words, Photon, Pelias, HERE, Neutrino, Plus codes",
+  "type": "module",
+
   "source": "src/index.ts",
-  "main": "dist/Control.Geocoder.js",
-  "module": "dist/Control.Geocoder.modern.js",
+  "main": "dist/Control.Geocoder.umd.js",
+  "module": "dist/Control.Geocoder.js",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/Control.Geocoder.modern.js"
+      },
+      "require": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/Control.Geocoder.cjs"
+      }
+    },
+    "./dist/Control.Geocoder.css": "./dist/leaflet-control-geocoder.css",
+    "./Control.Geocoder.css": "./dist/leaflet-control-geocoder.css",
+    "./style.css": "./dist/leaflet-control-geocoder.css"
+  },
   "types": "dist/index.d.ts",
   "scripts": {
     "prepare": "npm run build",
-    "build": "npm run build:1 && npm run build:2 && npm run build:3",
-    "build:1": "microbundle --no-pkg-main --entry src/index.ts --format iife --globals leaflet=L --output dist/Control.Geocoder.js --no-compress",
-    "build:2": "microbundle --no-pkg-main --entry src/index.ts --format iife --globals leaflet=L --output dist/Control.Geocoder.min.js",
-    "build:3": "microbundle --no-pkg-main --entry src/index.ts --format modern --output dist/Control.Geocoder.modern.js --no-compress",
+    "build": "vite build",
     "build:demo": "npm run build:demo-esbuild && npm run build:demo-rollup && npm run build:demo-webpack",
     "build:demo-esbuild": "cd demo-esbuild && npm install && npm run build",
     "build:demo-rollup": "cd demo-rollup && npm install && npm run build",
     "build:demo-webpack": "cd demo-rollup && npm install && npm run build",
     "changelog": "conventional-changelog --infile CHANGELOG.md --same-file --output-unreleased",
-    "doc": "typedoc --mode file --excludePrivate --stripInternal --moduleResolution node --out docs/ src/",
-    "test": "vitest run --dom",
-    "lint": "eslint --ext .js,.ts ."
+    "doc": "typedoc --excludePrivate --exclude node_modules/** --out docs/ src/",
+    "test": "vitest run --dom"
   },
   "repository": {
     "type": "git",
@@ -63,24 +76,21 @@
   },
   "devDependencies": {
     "@types/leaflet": "^1.5.12",
-    "@typescript-eslint/eslint-plugin": "^4.8.1",
-    "@typescript-eslint/parser": "^4.8.1",
     "conventional-changelog-cli": "^2.1.0",
-    "eslint": "^6.8.0",
-    "eslint-plugin-prettier": "^3.1.2",
     "happy-dom": "^15.11.7",
     "leaflet": "^1.6.0",
-    "microbundle": "^0.13.0",
     "prettier": "^1.19.1",
-    "tslib": "^1.11.1",
-    "typedoc": "^0.19.2",
-    "typescript": "^3.8.3",
+    "typedoc": "^0.27.5",
+    "typescript": "^5.7.2",
+    "vite": "^6.0.3",
+    "vite-plugin-dts": "^4.3.0",
     "vitest": "^2.1.8"
   },
   "peerDependencies": {
     "leaflet": "^1.6.0"
   },
   "optionalDependencies": {
     "open-location-code": "^1.0.0"
-  }
+  },
+  "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
 }

package.json

@@ -131,7 +131,6 @@ export class GeocoderControl extends EventedControl {
   private _alts: HTMLUListElement;
   private _container: HTMLDivElement;
   private _errorElement: HTMLDivElement;
-  private _form: HTMLDivElement;
   private _geocodeMarker: L.Marker;
   private _input: HTMLInputElement;
   private _lastGeocode: string;
@@ -171,11 +170,11 @@ export class GeocoderControl extends EventedControl {
     const className = 'leaflet-control-geocoder';
     const container = L.DomUtil.create('div', className + ' leaflet-bar') as HTMLDivElement;
     const icon = L.DomUtil.create('button', className + '-icon', container) as HTMLButtonElement;
-    const form = (this._form = L.DomUtil.create(
+    const form = L.DomUtil.create(
       'div',
       className + '-form',
       container
-    ) as HTMLDivElement);
+    ) as HTMLDivElement;
 
     this._map = map;
     this._container = container;

src/control.ts

@@ -9,6 +9,7 @@
 import * as L from 'leaflet';
 import { GeocoderControl as Geocoder, geocoder } from './control';
 import * as geocoders from './geocoders/index';
+import './style.css';
 
 L.Util.extend(Geocoder, geocoders);
 export default Geocoder;

src/index.ts

@@ -0,0 +1 @@
+/// <reference types="vite/client" />

dist/Control.Geocoder.css src/style.cssdist/Control.Geocoder.css renamed to src/style.css

@@ -1,8 +1,24 @@
 {
   "compilerOptions": {
-    "target": "es5",
-    "module": "es2015",
-    "esModuleInterop": true,
-    "strict": false
-  }
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "module": "ESNext",
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "isolatedModules": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+
+    /* Linting */
+    "strict": false,
+    "noUnusedLocals": true,
+    "noUnusedParameters": false,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["src"]
 }

src/vite-env.d.ts

@@ -0,0 +1,28 @@
+import { defineConfig } from 'vite';
+import dts from 'vite-plugin-dts';
+
+// https://vite.dev/guide/build.html#library-mode
+export default defineConfig({
+  build: {
+    lib: {
+      entry: 'src/index.ts',
+      name: 'leaflet-control-geocoder',
+      formats: ['es', 'umd'],
+      fileName: format =>
+        ({
+          es: `Control.Geocoder.modern.js`,
+          umd: `Control.Geocoder.js`
+        })[format]
+    },
+    sourcemap: true,
+    rollupOptions: {
+      external: ['leaflet'],
+      output: {
+        globals: {
+          leaflet: 'L'
+        }
+      }
+    }
+  },
+  plugins: [dts()]
+});