[Web] issues bundling onnxruntime-web using webpack.

[abgoswam]

Describe the issue

We have a example of using onnxruntime-web in a standalone TS file

• gist
• onnxruntime-web@1.13.1
• this runs successfully

However when we have the same code inside a webpack bundler, we hit compile time errors:

ERROR in ../node_modules/onnxruntime-web/lib/backend-onnxjs.ts 10:20
Module parse failed: Unexpected token (10:20)
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
| import {OnnxjsSessionHandler} from './onnxjs/session-handler';
|
> class OnnxjsBackend implements Backend {
|   // eslint-disable-next-line @typescript-eslint/no-empty-function
|   async init(): Promise<void> {}
@ ../node_modules/onnxruntime-web/lib/index.js 22:26-67
@ ../lib/src/ghostText/contextualFilter.ts 9:12-38
@ ./src/init.ts 13:27-78
@ ./src/agent.ts 3:15-32

ERROR in ../node_modules/onnxruntime-web/lib/backend-wasm.ts 18:32
Module parse failed: Unexpected token (18:32)
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
|  * being created, to override default value.
|  */
> export const initializeFlags = (): void => {
|   if (typeof env.wasm.initTimeout !== 'number' || env.wasm.initTimeout < 0) {
|     env.wasm.initTimeout = 0;
@ ../node_modules/onnxruntime-web/lib/index.js 26:24-61
@ ../lib/src/ghostText/contextualFilter.ts 9:12-38
@ ./src/init.ts 13:27-78
@ ./src/agent.ts 3:15-32

Root cause:

onnxruntime-web should point to dist/ort-web.node.js instead of trying to recompile from lib/index

• we want webpack to pick the file node_modules/onnxruntime-web/dist/ort-web.node.js instead of node_modules/onnxruntime-web/lib/index.ts
• not sure why there is an attempt to re-compile onnxruntime-web (?)

Approaches tried

1. using webpack Resolve
   • 'onnxruntime-web': path.resolve(__dirname, 'node_modules/onnxruntime-web/dist/ort-web.node.js')
   • 'onnxruntime-web$': 'onnxruntime-web/dist/ort-web.node.js'
   • did not work
2. using require('onnxruntime-web/dist/ort-web.node.js')
   • hacky approach. worked

Summary

Bundling onnxruntime-web using webpack seems to hit compile issues.

Would it be possible to have an example which shows how to force webpack to pick the path from dist (not lib) ?

To reproduce

onnxruntime-web@1.13.1

Urgency

we have a hacky approach that works. would be good to figure out the correct way of doing this

ONNX Runtime Installation

Released Package

ONNX Runtime Version or Commit ID

1.13.1

Execution Provider

WASM

[abgoswam]

• hack
  • const {Tensor, InferenceSession, env} = require('onnxruntime-web/dist/ort-web.node.js');
  • this loses type information

if we do:

• import {Tensor, InferenceSession, env} from 'onnxruntime-web/dist/ort-web.node.js';
• this results in error TS7016: Could not find a declaration file for module 'onnxruntime-web/dist/ort-web.node.js'

if the expectation is that users pick the pre-built files from node_modules/onnxruntime-web/dist , then the declaration file for the types should also be bin placed in the appropriate location.

[abgoswam]

cc @fs-eire

[abgoswam]

@fs-eire , i notice there were some PR's referencing this issue. do these PR's fix the issue we observed for ort-web ?

if you have a new package version that you would like me to try out plz let me know

cc @parinitarahi , @faxu

[fs-eire]

It may take a few days for the nightly build being available on NPM. if you want to test if this change is working or not, simply remove the "module" field in file node_modules/onnxruntime-web/package.json from your code base and try it again.

[abgoswam]

thanks @fs-eire for taking a look at this issue.

once the package becomes available on NPM I will give it a try .

presently, the latest "dev" version is from 3 days ago:

• https://www.npmjs.com/package/onnxruntime-web?activeTab=versions
  

[abgoswam]

if you want to test if this change is working or not, simply remove the "module" field in file node_modules/onnxruntime-web/package.json from your code base and try it again.

tried this. but i hit the same compile time error above.

[fs-eire]

issue is fixed in #14532 and validated in onnxruntime-web@1.15.0-dev.20230206-b8fb9320ac

[neiz]

@abgoswam were you able to use this onnxruntime-web@1.15.0-dev.20230206-b8fb9320ac to get it successfully working? I'm having same issue as described bundling with webpack; issue persists even when using onnxruntime-web@1.15.0-dev.20230206-b8fb9320ac

additionally tried the most recent, 1.15.0-dev.20230317-e42f7487df; same issue persists

[abgoswam]

i was able to get past that error with: "onnxruntime-web": "^1.15.0-dev.20230212-12d91173c4"

cc @neiz