fix(FaceLandmarker): default basePath aligned with tasks-vision package version

package.json

@@ -91,6 +91,7 @@
     "@rollup/plugin-commonjs": "^19.0.0",
     "@rollup/plugin-json": "^4.1.0",
     "@rollup/plugin-node-resolve": "^13.0.0",
+    "@rollup/plugin-replace": "^5.0.2",
     "@storybook/addon-actions": "^7.0.12",
     "@storybook/addon-controls": "^7.0.12",
     "@storybook/addon-essentials": "^7.0.12",
@@ -135,6 +136,7 @@
     "typescript": "^4.7.4",
     "vite": "^4.3.6",
     "vite-plugin-glslify": "^2.0.1",
+    "vitest": "^0.32.0",
     "yarn": "^1.22.17"
   },
   "peerDependencies": {

rollup.config.js

@@ -5,6 +5,8 @@ import json from '@rollup/plugin-json'
 import glslify from 'rollup-plugin-glslify'
 import multiInput from 'rollup-plugin-multi-input'
 import { terser } from 'rollup-plugin-terser'
+import replace from '@rollup/plugin-replace'
+import { version as mediapipeTasksVisionVersion } from '@mediapipe/tasks-vision/package.json'
 
 const root = process.platform === 'win32' ? path.resolve('/') : '/'
 const external = (id) => !id.startsWith('.') && !id.startsWith(root)
@@ -41,12 +43,18 @@ const getBabelOptions = ({ useESModules }) => ({
   ],
 })
 
+export const replacements = {
+  preventAssignment: true,
+  'process.env.ROLLUP_REPLACE_MEDIAPIPE_TASKS_VISION_VERSION': JSON.stringify(mediapipeTasksVisionVersion),
+}
+
 export default [
   {
     input: ['src/**/*.ts', 'src/**/*.tsx', '!src/index.ts'],
     output: { dir: `dist`, format: 'esm' },
     external,
     plugins: [
+      replace(replacements),
       multiInput(),
       json(),
       glslify(),
@@ -59,6 +67,7 @@ export default [
     output: { dir: `dist`, format: 'esm' },
     external,
     plugins: [
+      replace(replacements),
       json(),
       glslify(),
       babel(getBabelOptions({ useESModules: true }, '>1%, not dead, not ie 11, not op_mini all')),
@@ -71,6 +80,7 @@ export default [
     output: { dir: `dist`, format: 'cjs' },
     external,
     plugins: [
+      replace(replacements),
       multiInput({
         transformOutputPath: (output) => output.replace(/\.[^/.]+$/, '.cjs.js'),
       }),
@@ -85,6 +95,13 @@ export default [
     input: `./src/index.ts`,
     output: { file: `dist/index.cjs.js`, format: 'cjs' },
     external,
-    plugins: [json(), glslify(), babel(getBabelOptions({ useESModules: false })), resolve({ extensions }), terser()],
+    plugins: [
+      replace(replacements),
+      json(),
+      glslify(),
+      babel(getBabelOptions({ useESModules: false })),
+      resolve({ extensions }),
+      terser(),
+    ],
   },
 ]

src/core/FaceLandmarker.tsx

@@ -13,7 +13,7 @@ type FaceLandmarkerProps = {
 }
 
 export const FaceLandmarkerDefaults = {
-  basePath: 'https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@0.10.2-rc2/wasm',
+  basePath: `https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@${process.env.ROLLUP_REPLACE_MEDIAPIPE_TASKS_VISION_VERSION}/wasm`,
   options: {
     baseOptions: {
       modelAssetPath:

vite.config.js

@@ -1,6 +1,8 @@
 // vite.config.js
 import glslify from 'vite-plugin-glslify'
+import replace from '@rollup/plugin-replace'
+import { replacements } from './rollup.config'
 
 export default {
-  plugins: [glslify()],
+  plugins: [replace(replacements), glslify()],
 }