xenova / transformers.js

State-of-the-art Machine Learning for the web. Run 🤗 Transformers directly in your browser, with no need for a server!

Home Page:https://huggingface.co/docs/transformers.js

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

TypeError: Cannot read properties of undefined (reading 'create')

vnikolaew opened this issue · comments

System Info

"@xenova/transformers": "^2.17.1",
"onnxruntime-node": "^1.17.0",
Windows 11
Chrome
❯ npm --version
10.5.2
❯ node --version
v22.0.0

Next.js v14.0.4

Environment/Platform

  • Website/web-app
  • Browser extension
  • Server-side (e.g., Node.js, Deno, Bun)
  • Desktop app (e.g., Electron)
  • Other (e.g., VSCode extension)

Description

I am trying to use the pipeline API in my Nextjs app ( more specifically in a NextJS API Route).
But I am getting the below error. I am not sure what I am doing wrong.

TypeError: Cannot read properties of undefined (reading 'create')
    at constructSession (webpack-internal:///(rsc)/../../node_modules/@xenova/transformers/src/models.js:440:39)
    at async Promise.all (index 1)
    at async BertModel.from_pretrained (webpack-internal:///(rsc)/../../node_modules/@xenova/transformers/src/models.js:1001:20)
    at async AutoModel.from_pretrained (webpack-internal:///(rsc)/../../node_modules/@xenova/transformers/src/models.js:4993:20)
    at async Promise.all (index 1)
    at async loadItems (webpack-internal:///(rsc)/../../node_modules/@xenova/transformers/src/pipelines.js:2837:5)
    at async pipeline (webpack-internal:///(rsc)/../../node_modules/@xenova/transformers/src/pipelines.js:2789:21)
    at async SentenceSimilarity.run (webpack-internal:///(rsc)/../worker/src/lib/tasks/SentenceSimilarity.ts:21:30)
    at async ClassifyImagesWorker.processCore (webpack-internal:///(rsc)/../worker/src/lib/ClassifyImagesWorker.ts:83:20)
    at async time (webpack-internal:///(rsc)/./app/api/utils.ts:10:20)
    at async V1InngestExecution.eval [as userFnToRun] (webpack-internal:///(rsc)/./app/api/inngest/functions.ts:25:5

This is my next.config.mjs:

// eslint-disable-next-line @typescript-eslint/no-var-requires
const { composePlugins, withNx } = require("@nx/next");

/**
 * @type {import("@nx/next/plugins/with-nx").WithNxOptions}
 **/
const nextConfig = {
   output: `standalone`,
   nx: {
      // Set this to true if you would like to use SVGR
      // See: https://github.com/gregberge/svgr
      svgr: false,

   },
   typescript: {
      ignoreBuildErrors: true,
   },
   sentry: {
      disableServerWebpackPlugin: true,
      disableClientWebpackPlugin: true,
   },
   experimental: {
      serverComponentsExternalPackages: ["sharp", "onnxruntime-node"],
   },
   webpack: (config) => {
      // See https://webpack.js.org/configuration/resolve/#resolvealias
      config.externals = [...config.externals, "hnswlib-node"];

      config.resolve.alias = {
         ...config.resolve.alias,
         "sharp$": false,
         "onnxruntime-node$": false,
      };
      return config;
   },
   images: {
      remotePatterns: [
         {
            hostname: "lh3.googleusercontent.com",
            protocol: `https`,
         },
         {
            hostname: "randomuser.me",
            protocol: `https`,
         },
         {
            hostname: "cdn.{APP_NAME}.com",
            protocol: `https`,
         },
         {
            hostname: "{APP_NAME}.com",
            protocol: `https`,
         },
         {
            hostname: "files.stripe.com",
            protocol: `https`,
         },
         {
            hostname: "live.staticflickr.com",
            protocol: `https`,
         },
         {
            hostname: "staticflickr.com",
            protocol: `https`,
         },
         {
            hostname: "cdn.pixabay.com",
            protocol: `https`,
         },
         {
            hostname: "www.dropbox.com",
            protocol: `https`,
         },
      ],
   },
};

const plugins = [
   // Add more Next.js plugins to this list if needed.
   withNx,
];

module.exports = composePlugins(...plugins)(nextConfig);

I am calling pipeline server-side:

this.extractor = await pipeline(
            "feature-extraction",
             "Snowflake/snowflake-arctic-embed-s",
            {
               quantized: false, // Comment out this line to use the quantized version
            });

Any help/recommendation would be highly appreciated!

Reproduction

  1. create next.js app
  2. install @xenova/transformer npm package
  3. call pipeline API in any API route

I'm getting similar error TypeError: Cannot read properties of undefined (reading 'constructor')

EDIT: was a mistake in the Supabase code that I'd follow. I already fix it

Can you try remove these lines (since you already have set them as external):

      config.resolve.alias = {
         ...config.resolve.alias,
         "sharp$": false,
         "onnxruntime-node$": false,
      };

I think this is the problem, which ignores these packages.

Now I get the following error when commenting out these lines:

 ⨯ ../../node_modules/@xenova/transformers/node_modules/onnxruntime-node/bin/napi-v3/darwin/arm64/onnxruntime_binding.node
Module parse failed: Unexpected character '�' (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
(Source code omitted for this binary file)

Import trace for requested module:
../../node_modules/@xenova/transformers/node_modules/onnxruntime-node/bin/napi-v3/darwin/arm64/onnxruntime_binding.node
../../node_modules/@xenova/transformers/node_modules/onnxruntime-node/bin/napi-v3/ sync ^\.\/.*\/.*\/onnxruntime_binding\.node$
../../node_modules/@xenova/transformers/node_modules/onnxruntime-node/dist/binding.js
../../node_modules/@xenova/transformers/node_modules/onnxruntime-node/dist/backend.js
../../node_modules/@xenova/transformers/node_modules/onnxruntime-node/dist/index.js
../../node_modules/@xenova/transformers/src/backends/onnx.js
../../node_modules/@xenova/transformers/src/env.js
../../node_modules/@xenova/transformers/src/transformers.js

Any updates on this? Im facing exactly the same issue.

It looks like Next.js v14 has removed experimental.serverComponentsExternalPackages. It is now https://nextjs.org/docs/app/api-reference/next-config-js/serverExternalPackages. Could you try that?