Importing tensorflow in vite-CodePudding

Apologies in advance as I'm sure these are rather trivial matters - I am in the "hello world" phase of learning front-end development.

I have a hello-world vite app, which I created and ran simply via:

npm init @vitejs/app
cd hello-vite
npm install npm run dev

I'm able to view the outputted localhost url in my browser.

I also have a simple script that imports tensorflow and does something with it:

$ cat test.mjs 
import * as tf from '@tensorflow/tfjs-node'

const a = tf.tensor([[1, 2], [3, 4]]);
a.print();

$ node test.mjs 
2022-06-27 22:04:16.968270: I tensorflow/core/platform/cpu_feature_guard.cc:151] This TensorFlow binary is optimized with oneAPI Deep Neural Network Library (oneDNN) to use the following CPU instructions in performance-critical operations:  AVX2 AVX512F FMA
To enable them in other operations, rebuild TensorFlow with the appropriate compiler flags.
Tensor
    [[1, 2],
     [3, 4]]

Now I want to get this test.mjs behavior within my hello-vite app. So I tried something like:

$ cat main.ts 
import './style.css'
import * as tf from '@tensorflow/tfjs-node'

const a = tf.tensor([[1, 2], [3, 4]]);
a.print();

document.querySelector('#app').innerHTML = `
  <h1>Hello Vite!!!</h1>
  <a href="https://vitejs.dev/guide/features.html" target="_blank">Documentation</a>
`

But when I run npm run dev, it doesn't seem happy, and spouts seemingly unrelated complaints about aws stuff:

$ npm run dev

> [email protected] dev
> vite


  vite v2.9.12 dev server running at:

  > Local: http://localhost:3000/
  > Network: use `--host` to expose

  ready in 112ms.

✘ [ERROR] Could not resolve "mock-aws-s3"

    node_modules/@mapbox/node-pre-gyp/lib/util/s3_setup.js:43:28:
      43 │     const AWSMock = require('mock-aws-s3');
         ╵                             ~~~~~~~~~~~~~

  You can mark the path "mock-aws-s3" as external to exclude it from the bundle, which will remove
  this error. You can also surround this "require" call with a try/catch block to handle this
  failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "aws-sdk"

    node_modules/@mapbox/node-pre-gyp/lib/util/s3_setup.js:76:22:
      76 │   const AWS = require('aws-sdk');
         ╵                       ~~~~~~~~~

  You can mark the path "aws-sdk" as external to exclude it from the bundle, which will remove this
  error. You can also surround this "require" call with a try/catch block to handle this failure at
  run-time instead of bundle-time.

✘ [ERROR] Could not resolve "nock"

    node_modules/@mapbox/node-pre-gyp/lib/util/s3_setup.js:112:23:
      112 │   const nock = require('nock');
          ╵                        ~~~~~~

  You can mark the path "nock" as external to exclude it from the bundle, which will remove this
  error. You can also surround this "require" call with a try/catch block to handle this failure at
  run-time instead of bundle-time.

10:06:42 PM [vite] error while updating dependencies:
Error: Build failed with 3 errors:
node_modules/@mapbox/node-pre-gyp/lib/util/s3_setup.js:43:28: ERROR: Could not resolve "mock-aws-s3"
node_modules/@mapbox/node-pre-gyp/lib/util/s3_setup.js:76:22: ERROR: Could not resolve "aws-sdk"
node_modules/@mapbox/node-pre-gyp/lib/util/s3_setup.js:112:23: ERROR: Could not resolve "nock"
    at failureErrorWithLog (/home/dshin/vite_scratch/hello-vite/node_modules/esbuild/lib/main.js:1605:15)
    at /home/dshin/vite_scratch/hello-vite/node_modules/esbuild/lib/main.js:1251:28
    at runOnEndCallbacks (/home/dshin/vite_scratch/hello-vite/node_modules/esbuild/lib/main.js:1034:63)
    at buildResponseToResult (/home/dshin/vite_scratch/hello-vite/node_modules/esbuild/lib/main.js:1249:7)
    at /home/dshin/vite_scratch/hello-vite/node_modules/esbuild/lib/main.js:1358:14
    at /home/dshin/vite_scratch/hello-vite/node_modules/esbuild/lib/main.js:666:9
    at handleIncomingPacket (/home/dshin/vite_scratch/hello-vite/node_modules/esbuild/lib/main.js:763:9) 
    at Socket.readFromStdout (/home/dshin/vite_scratch/hello-vite/node_modules/esbuild/lib/main.js:632:7)
    at Socket.emit (events.js:314:20)
    at addChunk (_stream_readable.js:297:12)
Vite Error, /node_modules/.vite/deps/@tensorflow_tfjs-node.js?v=0ea0383e optimized info should be defined

If I comment out the print() call and the line before it, the errors disappear.

What am I doing wrong? How do I make sense of these errors?

CodePudding user response：

I don't know too much, but @tensorflow/tfjs-node appears to just be a Node project, and won't work in the browser.

For example, node-pre-gyp is a C binding library for Node, that is definitely not going to work in the browser.

You can try doing npm install mock-aws-s3 and the other libraries that errored, see how far that gets you, but likely won't help.