build: add reusable build script

.github/workflows/ci-build.yml

@@ -5,7 +5,7 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node-version: [18, 20]
+        node-version: [20]
     steps:
       - name: Checkout 🛎️
         uses: actions/checkout@v4

package.json

@@ -7,7 +7,7 @@
     "build": "lerna run build",
     "build:force": "lerna run build --skip-nx-cache",
     "clean": "lerna run clean",
-    "dev": "pnpm run --filter @boxslider/examples dev",
+    "dev": "pnpm run --filter=examples dev",
     "format": "prettier --write .",
     "lint": "prettier --check . && eslint",
     "prepare": "husky",
@@ -59,5 +59,8 @@
     "*.{md,html}": [
       "prettier --write"
     ]
+  },
+  "dependencies": {
+    "@types/node": "20"
   }
 }

packages/components/build.js

@@ -0,0 +1,15 @@
+import { join } from 'path'
+import build from '../../scripts/build.js'
+
+const srcDir = join(import.meta.dirname, 'src')
+const outDir = join(import.meta.dirname, 'dist')
+const entryPoints = [
+  'index.ts',
+  'Carousel.ts',
+  'Cube.ts',
+  'Fade.ts',
+  'SliderControls.ts',
+  'Tile.ts',
+].map((entry) => join(srcDir, entry))
+
+await build(entryPoints, outDir)

packages/components/package.json

@@ -20,41 +20,21 @@
   "exports": {
     ".": {
       "import": "./dist/esm/index.js",
-      "require": "./dist/cjs/index.cjs",
+      "require": "./dist/cjs/index.js",
       "types": "./dist/types/index.d.ts"
     },
-    "./Carousel": {
-      "import": "./dist/esm/Carousel.js",
-      "require": "./dist/cjs/Carousel.cjs",
-      "types": "./dist/types/Carousel.d.ts"
+    "./*": {
+      "import": "./dist/esm/*.js",
+      "require": "./dist/cjs/*.js",
+      "types": "./dist/types/*.d.ts"
     },
-    "./Cube": {
-      "import": "./dist/esm/Cube.js",
-      "require": "./dist/cjs/Cube.cjs",
-      "types": "./dist/types/Cube.d.ts"
-    },
-    "./Fade": {
-      "import": "./dist/esm/Fade.js",
-      "require": "./dist/cjs/Fade.cjs",
-      "types": "./dist/types/Fade.d.ts"
-    },
-    "./Tile": {
-      "import": "./dist/esm/Tile.js",
-      "require": "./dist/cjs/Tile.cjs",
-      "types": "./dist/types/Tile.d.ts"
-    },
-    "./SliderControls": {
-      "import": "./dist/esm/SliderControls.js",
-      "require": "./dist/cjs/SliderControls.cjs",
-      "types": "./dist/types/SliderControls.d.ts"
-    },
-    "./style/": "./src/style/"
+    "./style/*": "./src/style/*.css"
   },
-  "main": "./dist/cjs/index.cjs",
+  "main": "./dist/cjs/index.cs",
   "types": "./dist/types/index.d.ts",
   "scripts": {
     "build": "pnpm run clean && pnpm run build:lib && pnpm run build:types",
-    "build:lib": "../../scripts/build.js",
+    "build:lib": "node build.js",
     "build:types": "tsc --project tsconfig.types.json --emitDeclarationOnly --outDir dist/types",
     "clean": "rm -rf dist && rm -f LICENSE",
     "dev": "vite",

packages/react/build.js

@@ -0,0 +1,18 @@
+import { join } from 'path'
+import build from '../../scripts/build.js'
+
+const srcDir = join(import.meta.dirname, 'src')
+const outDir = join(import.meta.dirname, 'dist')
+const entryPoints = [
+  'index.ts',
+  'core.ts',
+  'Carousel.tsx',
+  'Cube.tsx',
+  'Fade.tsx',
+  'Tile.tsx',
+].map((entry) => join(srcDir, entry))
+
+await build(entryPoints, outDir, {
+  bundle: false,
+  packages: 'external',
+})

packages/react/package.json

@@ -19,44 +19,27 @@
   "exports": {
     ".": {
       "import": "./dist/esm/index.js",
-      "require": "./dist/cjs/index.cjs",
+      "require": "./dist/cjs/index.js",
       "types": "./dist/types/index.d.ts"
     },
-    "./Carousel": {
-      "import": "./dist/esm/Carousel.js",
-      "require": "./dist/cjs/Carousel.cjs",
-      "types": "./dist/types/Carousel.d.ts"
-    },
-    "./Cube": {
-      "import": "./dist/esm/Cube.js",
-      "require": "./dist/cjs/Cube.cjs",
-      "types": "./dist/types/Cube.d.ts"
-    },
-    "./Fade": {
-      "import": "./dist/esm/Fade.js",
-      "require": "./dist/cjs/Fade.cjs",
-      "types": "./dist/types/Fade.d.ts"
-    },
-    "./Tile": {
-      "import": "./dist/esm/Tile.js",
-      "require": "./dist/cjs/Tile.cjs",
-      "types": "./dist/types/Tile.d.ts"
+    "./*": {
+      "import": "./dist/esm/*.js",
+      "require": "./dist/cjs/*.js",
+      "types": "./dist/types/*.d.ts"
     }
   },
-  "main": "./dist/cjs/index.cjs",
+  "main": "./dist/cjs/index.js",
   "types": "./dist/types/index.d.ts",
   "scripts": {
     "build": "pnpm run clean && pnpm run build:lib && pnpm run build:types",
-    "build:lib": "../../scripts/build.js",
+    "build:lib": "node build.js",
     "build:types": "tsc --project tsconfig.types.json --emitDeclarationOnly --outDir dist/types",
     "clean": "echo 'Cleaning' && rm -rf dist && rm -f LICENSE",
     "postbuild": "pnpm run types",
     "prepack": "cp ../../LICENSE ./"
   },
   "dependencies": {
-    "@boxslider/components": "workspace:*"
-  },
-  "devDependencies": {
+    "@boxslider/components": "workspace:*",
     "@boxslider/slider": "workspace:*"
   },
   "peerDependencies": {

packages/slider/build.js

@@ -0,0 +1,15 @@
+import { join } from 'path'
+import build from '../../scripts/build.js'
+
+const srcDir = join(import.meta.dirname, 'src')
+const outDir = join(import.meta.dirname, 'dist')
+const entryPoints = [
+  'index.ts',
+  'box-slider.ts',
+  'effects/tile/tile-slider.ts',
+  'effects/carousel-slider.ts',
+  'effects/cube-slider.ts',
+  'effects/fade-slider.ts',
+].map((entry) => join(srcDir, entry))
+
+await build(entryPoints, outDir)

packages/slider/package.json

@@ -54,7 +54,7 @@
     "build": "pnpm run clean && pnpm run esbuild && pnpm run types",
     "clean": "rm -rf dist && rm -f LICENSE",
     "dev": "vite",
-    "esbuild": "../../scripts/build.js",
+    "esbuild": "node build.js",
     "prepack": "cp ../../LICENSE ./",
     "types": "tsc --project tsconfig.types.json --emitDeclarationOnly --outDir dist/types"
   }