Digamos que estoy creando una biblioteca con algunas dependencias: reaccionar, momento, lodash y uuid, y quiero distribuir esto en formato ES y UMD.
También desconfío del tamaño final del paquete de la aplicación del usuario.
React debe ir a rollupOptions.external , ya que requiere que se ejecute una sola instancia de React en la aplicación. Pero ¿qué pasa con el resto?
En mi opinión, la biblioteca debe evitar incluir dependencias externas, ya que estas corren el riesgo de ser duplicadas por la aplicación del usuario de la biblioteca si utilizaran las mismas dependencias.
Por lo tanto, imagino que mi archivo vite.config.js se verá así:
const path = require("path"); const { defineConfig } = require("vite"); module.exports = defineConfig({ build: { // Let the library user control minification in their own bundler minify: false, sourcemap: true, lib: { entry: path.resolve(__dirname, "source/index.js"), name: "my-tiny-library", fileName: (format) => `my-tiny-library.${format}.js`, }, rollupOptions: { // Add _all_ external dependencies here external: ["moment", "uuid", "lodash", "react"], output: { globals: { moment: "moment", uuid: "uuid", lodash: "lodash" react: "react" }, }, }, }, }); package.json debe contener todas las dependencias enumeradas en externals como dependencies , y no devDependencies o peerDependencies .
La desventaja principal que veo con esto es que cualquiera que use paquetes UMD necesitaría incluir etiquetas de script adicionales con todas las dependencias de otras fuentes, por ejemplo: <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script> , y que estos no se agitarían, lo que requeriría paquetes más grandes. Dicho esto, creo que es una buena compensación.
¿Estás de acuerdo con este enfoque o recomiendas algo más?
Gracias