I have a library (as an npm package) that can be consumed in NodeJs and in a browser. It currently output as an UMD file. However, part of the library will now be browser specific (it will export React components).
How should I do this? Should I exclude browser specific files, let's say maybe all *.tsx files from the NodeJs output?
What else should i take into account?
I would really prefer if I don't need to create two different libraries, one with the pure JS code and the other with the browser-specific one.
It would be nice if one can run node.js code inside Excel user-defined functions. Something like using js code like VBA.
I googled for solutions but cannot find any. Is it possible to do this?
Yes, if you want to use packages from NPM. You could use webpack to combine all the stuff to one js file, it should work.
webpack as a static module bundler for modern JavaScript applications. When webpack processes your application, it internally builds a dependency graph which maps every module your project needs and generates one or more bundles. you could refers to this document.
You could also refer to a sample, Yeoman, the Yeoman generator creates a Node.js Office Add-in project. it use webpack combine all files into one js file.
There is a way to require html file in javascript file like webpack does with gulp?
For example in Angular js directive:
return {
template: require('./../index.html),
link : function() {}
}
No, angularjs is a client-side framework that is meant to run in a browser. Within a browser you generally speaking are not meant to be reading local files even if the purpose is just for including/requiring files.
Webpack is actually a node module (npm) that runs under nodejs. The require method is added by nodejs and allows you to load other javascript files. However, nodejs modules are always run by nodejs and never in the browser.
Having said that, there might be solutions to achieve what you want, here is one discussion of a similar issue.
I am using the modular folder structure shown here by tjholowaychuk.
Is it somehow possible to also have a separate client JS in each of these modules? Currently all my client JS is in the /assets/js folder, but it would be nice to have a JS file in the module instead.
After playing around with it, the best solution for me seems to be to put the client js under lib/module/client/, and then just use this path in the script tag. This way I can have a client js file for each module.
I have many JS snippets and files shared across multiple projects. I have to either copy-past them into a single file for each project, or serve them as individual files on cdn. Both are bad ideas.
Is there any dependency management and build tool like Maven for JavaScript? Ideally it would take a set of js dependencies and build a single js file which can be served on cdn.
I can write a script to do that. But I'm looking to find if anything comparable to Maven exists for JS.
Update 2014: Based on answers here and my research following are most popular tools:
Bower, NPM, RequireJS, Browserify, Webpack, Grunt, Gulp
There's RequireJS, but that's kind of a different thing than Maven, and what you're asking it to do is different than Maven too. There are any number of JS combiner/minifiers, like jekyll-combiner and a zillion others.
If you're using Maven, the JavaScript Maven Tools might be of interest. If you're not, I don't know of a unified way to specifiy, download, combine, etc. for arbitrary build systems. Some of the node.js stuff might be useful, but I've never used that outside of a node.js context, so I'm not sure.
http://webjars.org/ packages JS libraries as JAR files and makes them available under Maven.
RequireJS is not a replacement to WebJars; it complements it.RequireJS will use public JS files (on CDNs) at runtime, whereas Webjars will download the necessary files at build-time and have you host them yourself.
Because most JS files are not hosted on CDNs, I use Webjars to download the necessary JS files at build-time, and reference them using RequireJS. That way I get the best of both worlds.
Take a look to grunt. It's very flexible build tool for javascript projects. Used by jquery team and other big projects. It combine, minify, test, lint js files, wtitten in javascript, have dozens plugins for whatever you want