Missing definition file require.js while trying to use thebe-core in a JupyterLab extension

[nthiery]

I am trying to use thebe-core in a JupyterLab extension. To this end, I used:

jlpm add thebe-core

However, in subsequent builds of my extension, I get these errors:

jlpm build            
node_modules/thebe-core/dist/types/requireJsLoader.d.ts:4:23 - error TS2688: Cannot find type definition file for 'requirejs'.

4 /// <reference types="requirejs" />
                        ~~~~~~~~~

node_modules/thebe-core/dist/types/requireJsLoader.d.ts:6:23 - error TS2552: Cannot find name 'Require'. Did you mean 'Required'?

6     readonly require: Require;
                        ~~~~~~~

node_modules/thebe-core/dist/types/requireJsLoader.d.ts:7:22 - error TS2304: Cannot find name 'RequireDefine'.

7     readonly define: RequireDefine;
                       ~~~~~~~~~~~~~

node_modules/thebe-core/dist/types/requireJsLoader.d.ts:16:33 - error TS2552: Cannot find name 'Require'. Did you mean 'Required'?

16     load(postLoadFn?: (require: Require, define: RequireDefine) => Promise<void> | void): Promise<IRequireJS>;
                                   ~~~~~~~

node_modules/thebe-core/dist/types/requireJsLoader.d.ts:16:50 - error TS2304: Cannot find name 'RequireDefine'.

16     load(postLoadFn?: (require: Require, define: RequireDefine) => Promise<void> | void): Promise<IRequireJS>;
                                                    ~~~~~~~~~~~~~

node_modules/thebe-core/dist/types/server.d.ts:4:39 - error TS2307: Cannot find module 'thebe-lite' or its corresponding type declarations.

4 import type { LiteServerConfig } from 'thebe-lite';
                                        ~~~~~~~~~~~~

node_modules/thebe-core/dist/types/thebe/entrypoint.d.ts:12:38 - error TS2307: Cannot find module 'thebe-lite' or its corresponding type declarations.

12 import type { ThebeLiteGlobal } from 'thebe-lite';
                                        ~~~~~~~~~~~~


Found 7 errors in 3 files.

Errors  Files
     5  node_modules/thebe-core/dist/types/requireJsLoader.d.ts:4
     1  node_modules/thebe-core/dist/types/server.d.ts:4
     1  node_modules/thebe-core/dist/types/thebe/entrypoint.d.ts:12

Any suggestions?

The thebe-lite error was easy to fix by forcing jlpm add thebe-lite, though I would have expected this to be automatic with the dependency on thebe-lite written in thebe-core/.../package.json.

For information: I tried installing from a local clone of the development version of thebe by doing jlpm add /opt/thebe/packages/core; but I probably did that wrong since I get:

jlpm run build                              
src/index.ts:21:37 - error TS2307: Cannot find module 'thebe-core' or its corresponding type declarations.

21 import { PassiveCellRenderer } from 'thebe-core';

I have tried various things like cleaning up the cache, redoing a fresh install, ... However I am beginner in Javascript development and may well have screwed stupid things ... sorry :-)

Help appreciated!

[stevejpurves]

Hi @nthiery!

On thebe-lite it it listed as a "peer" dependency, which means thebe-core is essentially declaring which version it is expecting / compatible with but will expect that to be installed by a peer package / independently. This is used to stop multiple version of a package being added by related packages.

Bringing in the requirejs types npm install --save @types/requirejs may resolve the immediate error but using thebe-core inside a jupyter lab process wasn't something it was set up for, you might run into additional issues after this. let's see :)

I'm curious about your end objective @nthiery - what will your extension do?

[nthiery]

Thanks @stevejpurves for the quick feecback!

No luck alas (unless it was wrong to use jlpm instead of npm):

Details

> jlpm add @types/requirejs
...
> jlpm build               
node_modules/@types/node/globals.d.ts:96:9 - error TS2403: Subsequent variable declarations must have the same type.  Variable 'require' must be of type 'Require', but here has type 'NodeRequire'.
96     var require: NodeRequire;

~~~~~~~
node_modules/@types/requirejs/index.d.ts:395:13

395 declare var require: Require;

~~~~~~~

'require' was also declared here.
node_modules/@types/node/module.d.ts:296:14 - error TS2300: Duplicate identifier 'Module'.
296     export = Module;

~~~~~~
node_modules/@types/requirejs/index.d.ts:33:14

33     export = mod;

~~~

'Module' was also declared here.
node_modules/@types/node/vm.d.ts:40:14 - error TS2305: Module '"node:module"' has no exported member 'ImportAttributes'.
40     import { ImportAttributes } from "node:module";

~~~~~~~~~~~~~~~~
node_modules/@types/requirejs/index.d.ts:33:14 - error TS2300: Duplicate identifier 'Module'.
33     export = mod;

~~~
node_modules/@types/node/module.d.ts:296:14

296     export = Module;

~~~~~~

'Module' was also declared here.
Found 4 errors in 4 files.
Errors  Files

1  node_modules/@types/node/globals.d.ts:96

1  node_modules/@types/node/module.d.ts:296

1  node_modules/@types/node/vm.d.ts:40

1  node_modules/@types/requirejs/index.d.ts:33

We are building a jupyterlab widget that renders notebooks with a bespoke execution / rendering model, to be used in an application for repetitive exercises with randomization. To implement that, we want to have fine control on how cell inputs and outputs are rendered and interact with the kernel.

thebe-core and in particular things like PassiveCellRenderer seem like a very good starting point to not reimplement things from lower level JupyterLab tools.

[nthiery]

In case you'd have time for debugging together, I am available all day (French time) for a visio).

[stevejpurves]

@nthiery I realize that you are looking for a place to start without re-inventing the wheel 👍🏼 but trying to pull in thebe-core might be counter productive and introduce an awkward cross dependency (e.g. your jupyterlab extension is built for jlab 4.E while thebe is on 4.1.2) that could make maintenance harder.

The PassiveCellRenderer is a great example to follow but I would be tempted not to use it directly but just to create instances of the RenderMime, OutputArea and OutputModel in
the same way as it does and work from there.

thebe/packages/core/src/passive.ts

Line 12 in 6d825e4

readonly rendermime: IRenderMimeRegistry;

That means you'll be using and dependent upon the right versions of the jupyter apis without thebe's packaging getting in the way.

[nthiery]

Hi @stevejpurves,

Thanks a lot for the insight!