Enable tree shaking in Vue package (#859)

Author: santi

packages/@headlessui-vue/package.json

@@ -4,12 +4,13 @@
   "description": "A set of completely unstyled, fully accessible UI components for Vue 3, designed to integrate beautifully with Tailwind CSS.",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",
-  "module": "dist/headlessui.esm.js",
+  "module": "dist/index.esm.js",
   "license": "MIT",
   "files": [
     "README.md",
     "dist"
   ],
+  "sideEffects": false,
   "engines": {
     "node": ">=10"
   },

packages/@headlessui-vue/tsdx.config.js

@@ -3,8 +3,13 @@ const globals = {
 }
 
 module.exports = {
-  rollup(config) {
+  rollup(config, opts) {
     for (let key in globals) config.output.globals[key] = globals[key]
+    if (opts.format === 'esm') {
+      config = { ...config, preserveModules: true }
+      config.output = { ...config.output, dir: 'dist/', entryFileNames: '[name].esm.js' }
+      delete config.output.file
+    }
     return config
   },
 }