Search code examples
typescriptnext.jstsxmediapipe

Cannot import .task file in Next.js + Typescript

I tried to import model.task file in App.tsx file, but it shows some errors.

I trained hand gesture recognition model and exported it to model.task file using Python. And I'm going to import it in App.tsx which is Next.js + Typescript project.

import Model from '@/utils/models/model.task';

But I'm getting an error below.

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)

How to I resolve this issue? Please help me with that.

Solution

  • I think you've to declare .task in your webpack config

    Something like this

    // webpack.config.js
module.exports = {
  module: {
    rules: [
      {
        test: /\.task$/,
        use: 'file-loader',
      },
    ],
  },
};

    Take from https://v4.webpack.js.org/loaders/file-loader/