Hi everyone! I've installed v2.0.5 and configured the Monaco Editor.
Firstly, thanks so much to the development team, it's fantastic to see these improvements.
Now, using the 'setup tab' and allowing the use of installed modules within the function node, I've tested that these work, however there is no code completion for these.
Is this expected, or is there something I'm missing? I've tried this with common modules like lodash as well as a couple of unpublished modules I just used for testing (one written in JS directly, and the other in typescript with .d.ts files).
You are not missing anything. When I was developing Monaco for node-red, the impetus was on getting it's working and working stably. It is in the back of my mind about how to import types for modules automatically (and has been discussed n the PR and other places) but I don't have a good working in solution in my head yet.
There is however a temporary working solution. If you can find the d.ts file for a lib, you can place it in in the public folder alongside the other d.ts files. The only prerequisite is that you name it correctly.
For example, if you have d.ts for lodash then try putting that at ...
Thanks so much @Steve-Mcl for your quick response.
That has helped a bit but I still don't think it's quite right. When I copy the .d.ts file into the folder you mentioned, as long as I've created a typescript library which uses a namespace of the same name, then code completion will pick up on this. However there is a mismatch between the code completion and the code execution.
For example:
If I have a module called foo, and it has namespace foo with all the functions inside it.
If I then use tsc to compile this, and ensure the .d.ts file is in the location you mention
And install the module via npm
And expose this via the setup in the function node
I can then see code completion when I type foo inside the monaco editor
However I get an error when trying to execute foo.function1()
I can make the code work however if I type foo.foo.function1()
If I don't use the namespace inside the module, then completion doesn't work, but the execution works as expect at foo.function1().
It is reassuring to hear that there is intent to get this working automatically for included modules in the future, so thanks again!
When creating a module / library, is there anything we should keep in mind to increase it's chances of working with code completion inside future versions of the function node?
Thanks so much @Steve-Mcl , I haven't uploaded the module to npm (just used the local folder/directory name to install it). It's a very simple module with the following typescript file:
export declare function greet(name: string): string;
export declare function helloWorld(): string;
//# sourceMappingURL=codecompletiontest.d.ts.map
In order to show the name completion i need to uncomment the export namespace line, then generate the d.ts (without regenerating the js). The following d.ts after copied into place then works as expected:
export declare namespace codecompletiontest {
function greet(name: string): string;
function helloWorld(): string;
}
//# sourceMappingURL=codecompletiontest.d.ts.map
If it's easier for you to see the whole folder I've zipped it up, and as I couldn't upload it here, I've base64 encoded it:
I referenced the whole local folder as a an npm module. From the the folder containing the flows.json (on my machine this is ~/.node-red/), I ran:
npm install /path/to/codecompletiontest
the codecompletiontest folder (the one I zipped up and then encoded in my last post) has a package.json file in it so everything seemed to just install, with the contents of /path/to/codecompletiontest/ being added to ~/.node-red/node_modules/codecompletiontest/