Develop Reference

Don't include a JS library in webpack build (with the assumption that it'll be included in a script tag)

I'm using a large library (around 1 MB) along with webpack for building. The library is just used normally - it's in package.json's dependencies, and at some point in my code I import it with an import from <lib_name> (this is in Typescript).
So right now, when I run a webpack build, the end result bundle.js contains all (or most? not sure how much webpack trims, actually) of the library's code. So even my barebones application that's only a couple lines of code and an import has that big 1MB build size.
What I would like to do is have the library not be thrown into the final build, and instead basically have in my HTML file something like this:
<script src="https://some.cdn.here/thelibrary-v0.0.0.min.js"></script>
<script src="bundle.js"></script>
In other words, the files in the build would be something like:
BEFORE:
dist/
bundle.js -- 1005 KB
AFTER:
dist/
thelibrary-v0.0.0.min.js -- 1000 KB
bundle.js -- 5 KB
Where bundle.js becomes a very small file with just my code, and it simply expects the library to be loaded beforehand. To be clear - bundle.js would still be using things from the library and would need it to run. I'm not sure if this is actually possible or not, because I don't have a good understanding of how webpack actually handles imports and stuff (especially in conjunction with uglify/minification). Is it possible to do something like this, and if so, how?

It can be done with externals.
module.exports = {
//...
externals: {
jquery: 'jQuery'// thelibrary in your case
}
};

Merge multiple minified javascript files in recursive folders into one file

I have multiple minified files in multiple folder in a single folder for minified js.
I wish to create single js file from all of minified js.
Now I am using type command to concatenate all files like
type .\\v2\\dist\\js\\*.js >> .\\build\\a.min.js && type .\\v2\\dist\\js\\config\\*.js >> .\\build\\a.min.js && ...
Like wise I need to append all recursive folders.
Is there any clean way to do it.
Please don't suggest using Gulp or Grunt as we are already in process of removing them & using Webpack. Any code using webpack or using npm or simple command line is welcome.

If on Windows, you can use command line like below (refer to #dbenham's answer):
for /r "c:\javascripts" %F in (*.js) do #type "%F" >>concatenated.js
If on Linux or Mac, you can use find:
find ./v2/dist/js/ -name '*.js' -exec cat {} \; > ./build/a.min.js

I don't see the "node_modules/bin" folder after installing browserify

I'm trying to repeat this tutorial:
https://ampersandjs.com/learn/npm-browserify-and-modules/#npm-browserify-amp-modules
But after installing browserify I don't see folder: node_modules/.bin
Instead I see a folder node_modules/browserify. Inside there is a bin folder, and Iinside of it - cmd.js and args.js.
How should I change this line of code in my case: ./node_modules/.bin/browserify app.js -o app.bundle.js to compile all js files into one file?
Or maybe I need to install browserify some other way?

Put together, the flow of creating a very simple web application with these tools might look something like this:
You simply need to point your cmd prompt to the browserify node_module, so drop the .bin if it's not there => /node_modules/browserify yourjsfile.js myjsfile.bundle.js
As far as I can understand this guide: the app.js file or yourjsfile.js needs to have all the library requirements included in order for it to work.
var squareNumbers = require('./square-numbers');
This means you need to write this file as an entry point for all your scripts you need to bundle.
TIP: try to find a youtube video or something to get a better understanding of this guide.
The dot in front of these directories tells you it's a system folder, in this case, not of your operating system, but from another "system/application", like node. It puts these kind of folders alphabetically on top to make a distinction.

RequireJs minifcation - complex directory structure

we have a problem at work, we are using require js but our folder structure is a bit different,
we have the following:
--js folder
--Folder
---some base js files
-Folder
---main
--src
---require.js
--- require JS modules
--plugin js files
--more js files
We would like to minify all these JS files to a SINGLe js file for production as such
---js folder
--min-all.js
Is this possible?
if so how? ..
Any help would be appreciated!
Thanks!
I just thought I would clarify that the other Folders contain standard non modular javascript files, they can be a mix of plugins or simple javascript helpers.

The short answer is: yes, RequireJS can do this.
Basically, you will need to create one JS file that requires all of the resources that you want minified. Then you will point the optimizer at that file and it will mash them all together.
require(["one", "../another/two", "folder/three", "folder/inner/four" ... ]);
If that file was called myfile.js, you would run the optimizer with similar parameters to this:
node r.js -o name=myfile out=optimized.js
If you have libraries or other files that you do not want included into the final optimized file, you would use the excludeShallow flag. e.g.
node r.js -o name=myfile out=optimized.js excludeShallow=jquery.min
There are more options so you should check out their optimization documentation if you haven't yet.

Command Line Options For YUI Compressor

This is probably a quick question. I'd like to run the YUI compressor so that, instead of overwriting all of the javascript files in the input directory, it dumps the output files into a subdirectory called min. I would like to do something like
java -jar yuicompressor-2.4.7.jar -o *.js .\min\*.js c:\MyJavascriptDirectory\*.*
but instead it just overwrites the existing files with the minified files. Does anyone know the correct syntax to accomplish this?
Thanks!

I'm not sure of the correct syntax to do that, but someone has made a modification so that you can set up your output directory as follows
java -jar yuicompressor.jar --output-dir /some/folder/for/compressed/js *js
This allows you to have a source folder and a compressed folder. As opposed to having source and a bunch of -min.js files in the same folder.
You can download the mod at the bottom of the page here http://yuilibrary.com/projects/yuicompressor/ticket/2528131

java -jar yuicompressor.jar -o '.js$:-min.js' *.js will minify all .js files and save them as -min.js then you could just move all those files: mkdir min; mv *-min.js min/.
Source