Node For Max Bundling in Collectives, Standalones and Max For Live Devices

Hello, Florian!

Thank you for your tutorial, but it seems there is something wrong here.

1. You wrote: "We will now create the simple script for this test scenario. For that open the node_content folder in a text editor of your choice and create a file called n4m-bundler.js". But in the file listing the n4m-bundler.js file is located in the root project folder N4M-Bundler:

N4M-Bundler/
├── patchers/
│ └── n4m-bundler.main.maxpat
└── node_content/
├── node_modules/
│ └── chance/
│ └── *** a whole bunch of files ***
├── package-lock.json
└── n4m-bundler.js

2. You wrote: "We will now edit our Project’s main patcher and install the required chance package from NPM. <...> Once done you should find a node_modules folder and a package-lock.json in the node_content folder and can remove the message from the patcher." But the node_modules folder is created in the project root folder as well and not in the node_content folder:

├── patchers/
│ └── n4m-bundler.main.maxpat
└── node_content/
├── node_modules/
│ └── chance/
│ └── *** a whole bunch of files ***
├── package-lock.json
└── n4m-bundler.js

So, there is a question: why do we need this 'node_content' folder? Looks like the Node For Max bundling works well without creating the additional folder: add main patcher and js-file to the project and then point to the 'node_modules' folder to the project search path.

Can you, please, bring a little light on this issue?

Thank you once again!

Hello Valery,

thanks for pointing this. And yeah sorry, it was in fact a mistake in these ASCII folder structures.

If things work for you without the node_content folder: great! However, we do recommend the usage of a separate folder (node_content in this example) for the node related content in projects. The reasons for that are mostly practical. It's easier to find/navigate the Node related content and we provide a sort of space for npm to do it's disk related work (writing/altering node_modules, creating debug logs etc) in order to avoid having it change the project's root folder. Also in more complex cases you'll be including more user authored JS files for Node For Max that are required/used for your script. This way adding a folder to the project ensures that they will be bundled as well.

Hope that makes sense? Thanks for following up and pointing out the little issue in the folder structures,

Florian

Hello, Florian!

Yes, now everything works as expected. Thank you for this useful tutorial!

Hey Florian,

A very detailed guide, thanks. When i run the script npm install <package-name> in my case, axios, the package is installed and the patch does what it's supposed to do, a http request.

However, my finder does not show any package.json or node_modules created. So the npm is installing the packages elsewhere. This would be a problem for bundling and distribution. Any ideas?

Hey Sandeep,

glad it's working for you. In terms of the installation location - it's kinda hard to pin that down given the limited information but I can try. To make sure you don't have any naming conflicts you can send a reveal message to node.script that should show the location of the file in your Finder or File Explorer. Is there a node_modules folder next to the file that gets revealed? If you are facing a naming conflict, we highly recommend namespacing your files, fe n4mtest.index.js where n4mtest would be the project specific namespace.

Fwiw, npm install will extend the dependencies of a pre-existing package.json file but not create one (only the package-lock.json gets created). The minimum requirements are a name and version field (you can learn more about the package.json here):

{
  "name": "mypackage",
  "version": "0.1.0"
}

Hope that helps a bit with understanding the functionality of npm install? Curious to see if there is in fact an issue with multiple files having the same name in your search path or if something else is at play. Let me know and I'm happy to assist further.

Thanks,
Florian

Hi Florian,
Thanks for this, super helpful for what I'm trying to do. I'm running into an error where the node_content folder can't be added to the application, and I'm not sure why. The Max Console reads as follows...

Adding file message.mxe64
Adding file prepend.mxe64
Adding file comment.mxe64
Adding folder node_content
Unable to add node_content!
Investigating Audio Status.maxpat...
Saving Patcher Audio Status.maxpat...
Copying External live.numbox
Copying External adstatus
Copying External umenu
Copying External metro
Copying External number
Copying External substitute
Copying External toggle
Copying External pak
Copying External speedlim
Copying External delay
Copying External button
Copying External js
Copying External bgcolor
Copying External universal
Copying External ubutton
Copying External zl
Including File interfacecolor.js
Copying External led
Copying External textbutton
Copying External panel
Copying External spray
Copying External Uzi
Copying External loadmess
Copying External !-
Copying External buddy
Copying External dspstate~
Successfully built project N4M-Bundler to application.

(emphasis mine)

There are no other errors, and the application opens just fine, but obviously can't find the n4m-bundler.js file. I'm running Windows 10, 64 bit.

I'm at a loss as to why this could be happening and I appreciate your help.

Thanks!
Stepan

Thanks for the reply Stepan. Please get in touch with our support as we might have to get a copy of your project in order to be able to reproduce the issue.

Thanks in advance.
Florian

Hi, Florian.

The issue " STEPAN DYACHKOVSKIY " mentioned is solved?
I have the same problem.

Adding folder node_content
Unable to add node_content!

I'm also running Windows 10, 64bit.
Thanks in advance.

I cannot reproduce the issue here on my end. If you still encounter issues with bundling on Windows please get in touch with our support so we can help you in a more detailed fashion.

Thanks
Florian