We Keep Coding

Is it possible to load twilio.js library with webpack?

What i need is a way to bundle all my javascript dependencies into one javascript file with Webpack (Just like with socket.io-client), but i can't do that with twilio.js.
I can see that the latest of twilio.js is listed here.:
https://www.twilio.com/docs/client/twilio-js as a script tag to:
//static.twilio.com/libs/twiliojs/1.2/twilio.min.js
But this is just a loader script for building the real twilio.js library here:
https://static.twilio.com/libs/twiliojs/refs/82278dd/twilio.min.js
And none of these supports Webpack.
https://github.com/twilio/twilio-node also exsistes, but this is for node.js only - not just plain client side javascript.
So my question is, is there a way to require the twilio.js library with Webpack ?

This answer is for Twilio.js client version 1.3.16 (script file, documentation).
The Twilio codebase is pretty bad. They don't publish their code to npm, and simply loading the twilio.js file from their CDN has side effects, including reading from window and looping through all script tags on the page. This means, even with the below answer, the client code can't be loaded in node, blocking server side rendering and testing, etc.
I published the package to npm as a mirror of the code, but it's not straightforward to use. Webpack can't correctly handle whatever bogus require structure they have set up. First, install:
npm install --save twilio-client-mirror
Then to use, require as normal:
import * as loadTwilio from 'twilio-client-mirror';
However, you can't actually use the loadTwilio object. You have to reference the global Twilio object, injected by the script:
const Twilio = window.Twilio;
Twilio.Device.setup(token);
...
This is a first attempt I made to try to include this flaky code inside a modern codebase. Hopefully with the coming 1.4 beta they will address these issues.

I know this is late, but I, too, just wrestled with this issue. Being new to Node, TypeScript and Webpack, I failed to understand that Webpack should be used for client-side scripts, while the Twilio-node library is a server-side library (as discussed loosely here). In other words, you shouldn't use require('twilio') in any client-side scripts...only Node scripts.
I had success with the following:
Add <script type="text/javascript" src="//static.twilio.com/libs/twiliojs/1.2/twilio.min.js"></script> to my main .html page
Use var twilio = require('twilio'); inside of a Node (server) script...not in client-side JavaScript (for example, add the Twilio calls inside of API methods, which can be created using a framework such as Express)
If you happen to be using TypeScript for Node scripting, use a transpiler such as the native TypeScript transpiler tsc (easy to do from a command line). If using JavaScript, use GulpJS (my fave) or GruntJS to help you consolidate and even run your Node server-side scripts
Use Webpack for anything else
Again, I'm new to this, so I'm open to input or corrections if I've stated anything incorrectly.

Compiling Modular Client-side Javascript

In Node.js, you can dynamically "require()" any javascript file likewise to PHP's require. I'd like to use this in my client-side code just for ease of development but not actually call a javascript function, but have a compiler replace the line with the contents of the respective file; effectively concatenating the files, not one after another, but inline within the code of one of the files. The closest thing I have found to this is smash. Are there any compilers, minifiers, etc that can do this?

Browserify might not be exactly what you want but it does definitely help with the ease of development issue. When you use Browserify, your code is your build tool. Browserify gives you all the benefits of writing code in node (no anon functions to avoid globals, npm, simple requires, imports instead of namespaced globals) and it allows you to package that code to run on the client with one command and only load one file.
You can checkout my open source js framework Luc JS for an example. It runs on node and IE6. I'm able keep the code modular and build the single browser file with a one line command.

Concatenate NPM package into one JS file

I am trying to get Swig (the template language) working on Parse Cloud Code with Express. Parse Cloud Code is a Node/Express host that doesn't allow NPM. Ridiculous, I know. I can still load external files into code with requires statements however, so I think that there's hope I can get this working.
So my question is how do I get the whole entire Swig package into a single JS file that I can include from my Parse Express app like so:
var swig = require("./cloud/swig.js");
Worth noting that Parse breaks normal require statements so that the NPM package as-is doesn't work without modifying each and every single file in the node_modules folder to have cloud in its path (which is why my above path has cloud in it). Parse also chokes while uploading lots of small files. Concatenation is a need on this platform.
I have tried playing with browserify for hours, but no combination of anything I do makes exposes the Swig object when I load the browserified file with the require statement. I think it may be the right option since the Browserified file includes all the files from Swig, but it doesn't expose them externally.
My question is either can this be done in browserify, and if so, how? Or is there another way to concatenate a NPM repo down to one file so it can be more easily included from this platform?
Thanks so much.

Browserify is not the right tool for the job.
As the name implies, browserify is intended to be used to generate files you want to execute in the browser. It walks the require calls from an entrypoint (i.e. some JS file you pass to browserify) and bundles them in an object that maps their names to functions wrapping the modules. It does not expect a require function to already exist and doesn't make any use of it. It substitutes its own implementation of require that only does one thing: look up names from the bundle, execute the matching function and return its exports.
You could theoretically require a browserify bundle, but it would just return an empty object (although it might mess with globals). And in all likelihood it might break because the bundled modules think they are being executed in a browser. This won't do any good.
The only sane option if you want to stick with the host, is to copy over the node_modules folder from your local project folder. This may not work if your computer and the server are not 100% compatible (e.g. 32-bit vs 64-bit, Debian vs RedHat, OSX/Windows vs Linux) but this mostly depends on your exact dependencies (basically anything that is built with node-gyp can be a problem).
Node.js uses the node_modules folder when looking up dependencies in require calls automagically. If you can somehow get a node_modules folder with the right contents on the server, require("foo") will work as long as node_modules contains a module foo.

Ultimately, you are trying to use npm modules in Parse Cloud code and currently it's not possible:
https://parse.com/questions/using-npm-modules-in-cloud-code
But if you are only trying to use Swig, then as a work-around, you can consider using underscore template instead. Parse already includes underscore:
https://parse.com/docs/cloud_modules_guide#underscore

Javascript compiler / dependency manager?

I have many JS files. Some of them depend on each other. Many of them depend on jQuery.
I need tool that can accept one file as parameter, fetch all its dependencies transitively and compile them into one file in proper order (based on dependencies)
Dependency information not always available inside files itself, so it would be nice to have it somewhere outside (xml file? folder structure?)
I've heard about Yahoo JS compiler, closure and so on, but I am not sure they do what I need.
Look: I have module "CustomerPage". It sould include "validation.js" and "gui.js". Both require jquery.js. And "gui.js" also requires "myFunctions.js".
I want some ant task or some script that would generate "CustomerPage.js" as result of all that files.
Tool should check dependency order, prevent double including and so on.
My project could have around 500 js files, how could I live with out of this tool?
People says "use GWT", but I need plain JS.

You might want to look at one of the AMD-style module loaders, such as RequireJS. Some of these can do what you want for precompiling, and can run in a development mode which makes it easier to debug by including all the files directly.

How to automate jshint as part of build process?

I want to automatically run JSHINT on all my javascript files as part of our continuous integration environment (actually, probably as part of TFS Gated Checkin, but I'm not sure yet as it will depend on speed).
I tried using rhino-jshint like this:
java -jar js.jar jshint-rhino.js myFile.js
but how can I set the required JSHint options? I know I could list them in a comment at the top of myfile.js, but I've got lots of javascript files, and I don't want the options duplicated in all my source files. (Or does JavaScript have an 'include' feature that I'm not aware of?)
I had hoped to pass an options.js file in as a parameter on the command line, and then keep options.js under version control. But I don't think this is possible with jshint-rhino.js.
Additionally, we are using a Visual studio extension to 'JSHint' all JavaScript files as we save them. But this tool cannot be ran on the command-line. We want the best of both worlds - running JSHint inside Visual Studio and Automated for the CI build, and then without duplicating the options (and indeed keeping the options under version control).
So the question is, how do other people automate JSHint in their development process?

If you want to check your Javascript while running a TFS build I would recommend having a look at sharplinter:
https://github.com/jamietre/SharpLinter
This contains a executable which allows you to check your Javascript files with JSLint/JSHint. To run this during your TFS build you could create a Code Activity which can be included into your workflow.
This video by Marcel de Vries from the Techdays 2012 goes through the automated build process step by step, and gives a demonstration on how to include your custom activity.
http://channel9.msdn.com/Events/TechDays/Techdays-2012-the-Netherlands/2361

Since you are essentially wanting to use a command-line activity inside of the TFS 2010 build process, then it is actually pretty simple. You'll want to add an InvokeProcess workflow activity (see MSDN documentation) at the point you want to run the tool.
There is actually a walkthrough available for how to do this with a different command-line utility but you'll just replace it with your own. The workflow activity even allows you to specify a set of command-line parameters that you can pass in.

Look at both http://gitcasette.com/ and http://net.tutsplus.com/tutorials/javascript-ajax/meeting-grunt-the-build-tool-for-javascript/