What is concat-with-sourcemaps?
The concat-with-sourcemaps npm package allows you to concatenate multiple files and generate source maps for the concatenated output. This is particularly useful in build processes where you need to combine multiple JavaScript or CSS files into a single file while maintaining the ability to debug the original source files.
What are concat-with-sourcemaps's main functionalities?
Concatenate files
This feature allows you to concatenate multiple files into a single file. The example code demonstrates how to concatenate two JavaScript files, 'file1.js' and 'file2.js', into a single file 'all.js'.
const Concat = require('concat-with-sourcemaps');
const concat = new Concat(true, 'all.js', '\n');
concat.add('file1.js', 'console.log("file1");\n');
concat.add('file2.js', 'console.log("file2");\n');
console.log(concat.content.toString());
console.log(concat.sourceMap);
Generate source maps
This feature allows you to generate source maps for the concatenated output. The example code demonstrates how to add source maps for 'file1.js' and 'file2.js' with a specified source root.
const Concat = require('concat-with-sourcemaps');
const concat = new Concat(true, 'all.js', '\n');
concat.add('file1.js', 'console.log("file1");\n', { sourceRoot: 'src' });
concat.add('file2.js', 'console.log("file2");\n', { sourceRoot: 'src' });
console.log(concat.content.toString());
console.log(concat.sourceMap);
Other packages similar to concat-with-sourcemaps
gulp-concat
gulp-concat is a Gulp plugin that concatenates files. It is similar to concat-with-sourcemaps but is designed to work within the Gulp build system. It also supports source maps but requires additional plugins like gulp-sourcemaps to generate them.
broccoli-concat
broccoli-concat is a Broccoli plugin for concatenating files. It is similar to concat-with-sourcemaps but is designed to work within the Broccoli build system. It supports source maps and offers more configuration options for handling input and output files.
webpack-concat-plugin
webpack-concat-plugin is a Webpack plugin that concatenates files and generates source maps. It is similar to concat-with-sourcemaps but is designed to work within the Webpack build system. It offers additional features like minification and custom file ordering.
Concat with source maps
NPM module for concatenating files and generating source maps.
Usage example
var concat = new Concat(true, 'all.js', '\n');
concat.add(null, "// (c) John Doe");
concat.add('file1.js', file1Content);
concat.add('file2.js', file2Content, file2SourceMap);
var concatenatedContent = concat.content;
var sourceMapForContent = concat.sourceMap;
API
new Concat(generateSourceMap, outFileName, separator)
Initialize a new concat object.
Parameters:
- generateSourceMap: whether or not to generate a source map (default: false)
- outFileName: the file name/path of the output file (for the source map)
- separator: the string that should separate files (default: no separator)
concat.add(fileName, content, sourceMap)
Add a file to the output file.
Parameters:
- fileName: file name of the input file (can be null for content without a file reference, e.g. a license comment)
- content: content (Buffer or string) of the input file
- sourceMap: optional source map of the input file (string). Will be merged into the output source map.
concat.content
The resulting concatenated file content (Buffer).
concat.sourceMap
The resulting source map of the concatenated files (string).