Client-Side Development Setup with Node.js - Looking for Feedback

Frontend
1

I’ve been working on a development setup and wanted to see if others have tried something similar or have ideas to make it better.

My current approach uses Node.js for building frontend code. I have Grunt with a watch task that combines and compresses all my source files into one minified file that goes into the public/js directory. For unit testing, I use Jasmine-node which requires an index file that loads all the individual source files.

Since I want the same code to work in both Node and browsers, I put everything under a global namespace like:

myProject.core.someModule

In my main file, I export to Node only if module and exports are available. This way I don’t need to add module.exports to every file. Instead I can just write:

(function() { myProject.core.someModule = function() {...} })();

or simply:

myProject.core.someModule = function() {...}

This works great in browsers since everything loads together, but in Node I sometimes get errors when one class tries to use another from the myProject namespace because I’m not handling dependencies properly like RequireJS would.

I’m thinking about adding require statements to files like a normal Node app, then stripping out Node-specific code during the build process.

Any thoughts or suggestions would be really helpful!

2

Nice setup! Why not try Rollup instead of Grunt? It’s great with ES6 modules and could fix your dependency issues without all the stripping. Also - what’s the story with jasmine-node over Jest? Jest might work better with how you’re handling namespaces.

3

This dependency issue is super common with isomorphic code. Instead of stripping out Node-specific stuff during build, try a lightweight dependency injection pattern in your global namespace. I’ve had good luck creating a module registry that handles loading order automatically. Just define your dependencies at the module level and have your namespace resolver check if required modules are loaded before running. It keeps your current structure but fixes the timing issues in Node. You could also go with UMD (Universal Module Definition) for each module - handles both CommonJS and global namespace scenarios way cleaner than conditional exports.

4

webpack’s probably overkill here. try browserify instead - it handles commonjs modules outta the box so you can keep using require() everywhere. just bundle it for the browser when you’re ready. way easier than stripping code during builds. i’ve been running this setup for months with zero major issues.