I would like to have something like less but for javascript files. I know that grunt-contrib-concat do that thing, making .map file from many .js files. I don't want to use grunt to success that task. Do you know any other package? I have searched others without success.
Webpack or SystemJS would be my recommendation. Both will actually build your javascript, resolving dependencies and allowing you to use es6 or commonjs module loading. This is a more modern and preferred approach to simply concatenating files.
Related
I often see browser-focused javascript libraries with an option to install over npm.
Is there a reason to install it using npm instead of just using <script src="cdn-url"></script>?
I am loading many libraries, so I guess it might be a good idea to fetch these files, so I don't make so many url requests (even though all the requests are targeting CDNs).
I could potentially install via npm and then use <script src='/node_modules/...'></script>, but then I need to make these paths public accessible using express.static() or something like that.
I know that I could use webpack, browserify, etc., but they seem overly complicated when I just want to bundle a few external libraries into 1 file automatically.
The point of using npm in this case is so you get the updates automatically. You bundle to reduce the number of requests and include only 1 script tag.
but they seem overly complicated when I just want to bundle a few external libraries into 1 file automatically.
This is complicated unfortunately. It would be nice if it wasn't. Also, you need to think about things like browser caching when you update a library. If you have a vendor libraries bundle, you will have to manually cachebust with a query string when you update. So to simplify the process, webpack does it all for you.
I would move to Webpack and use the CommonsChunkPlugin to create a vendor build. See this example.
To fully automate everything, combine this with Html Webpack Plugin to automatically add the script tags and cache-bust with hashing.
So i've been searching for the best way of concatenate n (log) files in node.js
The final file cannot be more than 100MB, if there is more, i should create an other one and so on.
I have some different approaches:
Use grunt and grunt and https://www.npmjs.com/package/grunt-contrib-concat
Use a simple npm like buldify https://github.com/powmedia/buildify
Do it from scratch with the fs node.js module
I wonder if you could throw me some of your experience here and also this question could be useful for someone in the future.
Cheers!
Both grunt-contrib-concat and buildify were designed to concatenate JS source files into one bundle, so they are not fit for your task.
I would suggest using something like logrotate-stream instead.
I'm writing a JS library and organizing the code in a hierarchy of CommonJS modules connected with require calls. Then in addition there are also external dependencies (like Underscore).
How can I bundle all my library modules into a single file (CommonJS+AMD) excluding the external dependencies which should remain as require calls?
I've experimented with Browserify and came close with --standalone and --external but when using Browserify again on the application that is using this bundled library it gets confused with the remaining require calls inside the bundled lib. And when I get rid of them with something like Derequire it will also strip out the require calls to external dependencies.
I tried to figure out how other libraries approach this but they mostly seem to have some custom concatenation scripts. Is there a simpler solution? Seems like it should be a common enough use case.
Try what you're already doing with standalone and external, then when you bundle the second time pass the noParse option to browserify (e.g. browserify({noParse: ['/abs/path/to/first/bundle']})). Or you could try minifying the first bundle. See also this answer.
So I have a node project with a javascript file that contains a huge function that has alot of code. I was wondering if I could breakup this standard javascript function, into seperate functions and have grunt "compile them" into 1 function in 1 file. Is this even possible?
Yes it is completely posible... There are various ways of doing it..
With grunt: Try this contrib module. It is very easy to use and all the documentation is detailed in the link.
Without grunt: On the other hand if you want to try something without grunt you could try the selectizer module. If it fits your needs I think that this is a much better option given that you can arrenge your dependecies explicitly using the requireJs syntax and then compile all the modules into one single clean file. That makes your code easier to maintain in the mid-term/long-term. Also you could select which modules to build and which not, so in the final build there are going to be only the module you selected and their dependencies and no more.
I have been creating projects using npm. For AMD I am using the native node require because it is convenient and does what I need it to do. To run my projects at the moment I am using grunt-watchify. This allows me to point a file of entry and a file of output. So at the moment it produces one file uncompressed or mangled.
I would like to know what is the best approach for compressing and mangling my final file. I have tried uglify after the file is built by watchify but it does not seem to work correctly. I feel that is a dirty hack anyway. So here is my questions?
What is the best way to build a node project into one file? Grunt library suggestions would be great. Any that support compression/minifying would also be great.
Thanks
Removed my dependency on grunt-watchify and now just use grunt-browersify and grunt-contrib-watch. I then use grunt-contrib-uglify and grunt-contrib-cssmin to minimize files afterwards.