react-tooltip 5.8.4-beta.0 → 5.8.4-beta.0-esbuild

package/esbuild.config.dev.mjs

@@ -0,0 +1,32 @@
+import * as esbuild from 'esbuild'
+import cssModulesPlugin from 'esbuild-css-modules-plugin'
+import fs from 'fs'
+
+const ctx = await esbuild.context({
+  entryPoints: ['./src/index-dev.tsx'],
+  bundle: true,
+  outdir: 'build',
+  treeShaking: true,
+  plugins: [
+    cssModulesPlugin({
+      v2: true,
+      v2CssModulesOption: {
+        pattern: `react-tooltip__[local]_[hash]`,
+      },
+    }),
+  ],
+})
+
+fs.copyFile('./public/index.html', './build/index.html', (err) => {
+  if (err) throw err
+})
+
+await ctx.watch()
+
+const { port } = await ctx.serve({
+  servedir: 'build',
+  port: 3000,
+  host: 'localhost',
+})
+
+console.log(`\n\n# Live Server: localhost:${port}`)

package/esbuild.config.prod.mjs

@@ -0,0 +1,92 @@
+import * as esbuild from 'esbuild'
+import cssModulesPlugin from 'esbuild-css-modules-plugin'
+import fs from 'fs'
+
+const buildsConfig = [
+  {
+    format: 'esm',
+    outfile: 'dist/react-tooltip.esm.js',
+    minify: false,
+  },
+  {
+    format: 'cjs',
+    outfile: 'dist/react-tooltip.cjs.js',
+    minify: false,
+  },
+  {
+    format: 'iife',
+    outfile: 'dist/react-tooltip.iife.js',
+    minify: false,
+  },
+  {
+    format: 'esm',
+    outfile: 'dist/react-tooltip.js', // for styles be exported as `react-tooltip.css`
+    minify: false,
+  },
+  {
+    format: 'esm',
+    outfile: 'dist/react-tooltip.esm.min.js',
+    minify: true,
+  },
+  {
+    format: 'cjs',
+    outfile: 'dist/react-tooltip.cjs.min.js',
+    minify: true,
+  },
+  {
+    format: 'iife',
+    outfile: 'dist/react-tooltip.iife.min.js',
+    minify: true,
+  },
+  {
+    format: 'esm',
+    outfile: 'dist/react-tooltip.min.js',
+    minify: true,
+  },
+]
+
+const builds = []
+
+buildsConfig.forEach(({ format, outfile, minify }) => {
+  builds.push(
+    esbuild.build({
+      entryPoints: ['./src/index.tsx'],
+      bundle: true,
+      outfile,
+      format,
+      treeShaking: true,
+      minify,
+      sourcemap: true,
+      external: ['react', 'react-dom', 'prop-types'],
+      plugins: [
+        cssModulesPlugin({
+          // inject: true,
+          v2: true,
+          v2CssModulesOption: {
+            pattern: `react-tooltip__[local]_[hash]`,
+          },
+        }),
+      ],
+    }),
+  )
+})
+
+await Promise.allSettled(builds)
+
+// Remove all unecessary or duplicated files from `dist` folder after build
+fs.unlink('./dist/react-tooltip.cjs.css', () => null) // generated by cjs build
+fs.unlink('./dist/react-tooltip.esm.css', () => null) // generated by esm build
+fs.unlink('./dist/react-tooltip.iife.css', () => null) // generated by iife build
+fs.unlink('./dist/react-tooltip.cjs.min.css', () => null) // generated by minified cjs build
+fs.unlink('./dist/react-tooltip.esm.min.css', () => null) // generated by minified esm build
+fs.unlink('./dist/react-tooltip.iife.min.css', () => null) // generated by minified iife build
+fs.unlink('./dist/react-tooltip.js', () => null) // generated by css build
+fs.unlink('./dist/react-tooltip.min.js', () => null) // generated by minified css build
+fs.unlink('./dist/react-tooltip.cjs.css.map', () => null) // generated by cjs build
+fs.unlink('./dist/react-tooltip.esm.css.map', () => null) // generated by esm build
+fs.unlink('./dist/react-tooltip.iife.css.map', () => null) // generated by iife build
+fs.unlink('./dist/react-tooltip.cjs.min.css.map', () => null) // generated by minified cjs build
+fs.unlink('./dist/react-tooltip.esm.min.css.map', () => null) // generated by minified esm build
+fs.unlink('./dist/react-tooltip.iife.min.css.map', () => null) // generated by minified iife build
+fs.unlink('./dist/react-tooltip.js.map', () => null) // generated by css build
+fs.unlink('./dist/react-tooltip.min.js.map', () => null) // generated by minified css build

package/package.json

@@ -1,17 +1,21 @@
 {
   "name": "react-tooltip",
-  "version": "5.8.4-beta.0",
+  "version": "5.8.4-beta.0-esbuild",
   "description": "react tooltip component",
   "scripts": {
-    "dev": "node ./cli.js --env=development && node --max_old_space_size=2048 ./node_modules/rollup/dist/bin/rollup -c rollup.config.dev.js --watch",
-    "build": "node ./cli.js --env=production && npm run types && node --max_old_space_size=2048 ./node_modules/rollup/dist/bin/rollup -c rollup.config.prod.js && npm run bundlesize",
+    "dev-rollup": "node ./cli.js --env=development && node --max_old_space_size=2048 ./node_modules/rollup/dist/bin/rollup -c rollup.config.dev.js --watch",
+    "build-rollup": "node ./cli.js --env=production && npm run types && node --max_old_space_size=2048 ./node_modules/rollup/dist/bin/rollup -c rollup.config.prod.js && npm run bundlesize",
+    "dev": "node ./cli.js --env=development && node ./esbuild.config.dev.mjs",
+    "build": "node ./cli.js --env=production && node ./esbuild.config.prod.mjs",
     "types": "node --max_old_space_size=2048 ./node_modules/rollup/dist/bin/rollup -c rollup.config.types.js",
     "eslint": "eslint --ext=js --ext=jsx --ext=ts --ext=tsx --fix ./src",
     "stylelint": "stylelint \"src/**/*.css\"",
     "prettier": "prettier --config ./.prettierrc.json --write \"src/**/*{.js,.jsx,.ts,.tsx,.css}\"",
     "prepare": "husky install",
     "bundlesize": "bundlesize",
-    "test": "jest"
+    "esbuild": "esbuild",
+    "test": "jest",
+    "postbuild": "npm run types && npm run bundlesize"
   },
   "main": "dist/react-tooltip.cjs.min.js",
   "module": "dist/react-tooltip.esm.min.js",
@@ -62,6 +66,8 @@
     "@typescript-eslint/parser": "^5.42.1",
     "bundlesize": "^0.18.1",
     "css-loader": "6.7.2",
+    "esbuild": "0.17.10",
+    "esbuild-css-modules-plugin": "^2.7.1",
     "eslint": "8.28.0",
     "eslint-config-airbnb": "19.0.4",
     "eslint-config-prettier": "^8.3.0",
@@ -79,8 +85,8 @@
     "prettier": "^2.4.1",
     "process": "^0.11.10",
     "prop-types": "^15.7.2",
-    "react": "16.14.0",
-    "react-dom": "16.14.0",
+    "react": "18.2.0",
+    "react-dom": "18.2.0",
     "rimraf": "^3.0.2",
     "rollup": "2.79.1",
     "rollup-plugin-analyzer": "^4.0.0",

package/tsconfig.json

@@ -15,8 +15,7 @@
     /* Language and Environment */
     "target": "es2018" /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */,
     "lib": [
-      "es2017",
-      "ESNext",
+      "es2018",
       "DOM"
     ] /* Specify a set of bundled library declaration files that describe the target runtime environment. */,
     "jsx": "react-jsx" /* Specify what JSX code is generated. */,