webpack-sources
Advanced tools
The webpack-sources package provides utility functions to manage source code and SourceMap data for webpack. It allows manipulation of the source code of modules and the generation of SourceMaps for better debugging support.
RawSource
RawSource is used to represent source code that does not need a SourceMap because it's not transformed.
const { RawSource } = require('webpack-sources');
const source = new RawSource('const a = 1;');
console.log(source.source());SourceMapSource
SourceMapSource is used when the source code has an associated SourceMap. It is useful for preserving source maps through transformations.
const { SourceMapSource } = require('webpack-sources');
const source = new SourceMapSource('const a = 1;', 'file.js', '{"version":3,"sources":["file.js"],"names":["a"],"mappings":"AAAA,MAAM,IAAI"}');
console.log(source.sourceAndMap());OriginalSource
OriginalSource is used for representing original source code that will be transformed. It generates a SourceMap for the original code.
const { OriginalSource } = require('webpack-sources');
const source = new OriginalSource('const a = 1;', 'file.js');
console.log(source.source());ReplaceSource
ReplaceSource allows modifications to the source code, such as replacing certain parts of it, while keeping track of changes for SourceMap generation.
const { ReplaceSource, OriginalSource } = require('webpack-sources');
const originalSource = new OriginalSource('const a = 1;', 'file.js');
const replaceSource = new ReplaceSource(originalSource);
replaceSource.replace(0, 10, 'const b = 2;');
console.log(replaceSource.source());ConcatSource
ConcatSource is used to concatenate multiple sources into a single source. It is useful for combining multiple assets into one.
const { ConcatSource, RawSource } = require('webpack-sources');
const source1 = new RawSource('const a = 1;');
const source2 = new RawSource('\nconst b = 2;');
const concatenatedSource = new ConcatSource(source1, source2);
console.log(concatenatedSource.source());The 'source-map' package provides utilities for generating and consuming source maps. It is similar to webpack-sources but is not specific to webpack and can be used in any JavaScript project.
The 'combine-source-map' package is used for creating a single source map out of multiple source maps. It is similar to the ConcatSource feature of webpack-sources but focuses solely on source maps.
The 'magic-string' package provides methods to edit strings (like code) and generate source maps. It is similar to ReplaceSource in webpack-sources but offers a different API and additional functionality for string manipulation.
Contains multiple classes which represent a Source. A Source can be asked for source code, size, source map and hash.
SourceBase class for all sources.
All methods should be considered as expensive as they may need to do computations.
sourceSource.prototype.source() -> String | Buffer
Returns the represented source code as string or Buffer (for binary Sources).
bufferSource.prototype.buffer() -> Buffer
Returns the represented source code as Buffer. Strings are converted to utf-8.
sizeSource.prototype.size() -> Number
Returns the size in bytes of the represented source code.
mapSource.prototype.map(options?: Object) -> Object | null
Returns the SourceMap of the represented source code as JSON. May return null if no SourceMap is available.
The options object can contain the following keys:
columns: Boolean (default true): If set to false the implementation may omit mappings for columns.sourceAndMapSource.prototype.sourceAndMap(options?: Object) -> {
source: String | Buffer,
map: Object | null
}
Returns both, source code (like Source.prototype.source() and SourceMap (like Source.prototype.map()). This method could have better performance than calling source() and map() separately.
See map() for options.
updateHashSource.prototype.updateHash(hash: Hash) -> void
Updates the provided Hash object with the content of the represented source code. (Hash is an object with an update method, which is called with string values)
RawSourceRepresents source code without SourceMap.
new RawSource(sourceCode: String | Buffer)
OriginalSourceRepresents source code, which is a copy of the original file.
new OriginalSource(
sourceCode: String | Buffer,
name: String
)
sourceCode: The source code.name: The filename of the original source code.OriginalSource tries to create column mappings if requested, by splitting the source code at typical statement borders (;, {, }).
SourceMapSourceRepresents source code with SourceMap, optionally having an additional SourceMap for the original source.
new SourceMapSource(
sourceCode: String | Buffer,
name: String,
sourceMap: Object | String | Buffer,
originalSource?: String | Buffer,
innerSourceMap?: Object | String | Buffer,
removeOriginalSource?: boolean
)
sourceCode: The source code.name: The filename of the original source code.sourceMap: The SourceMap for the source code.originalSource: The source code of the original file. Can be omitted if the sourceMap already contains the original source code.innerSourceMap: The SourceMap for the originalSource/name.removeOriginalSource: Removes the source code for name from the final map, keeping only the deeper mappings for that file.The SourceMapSource supports "identity" mappings for the innerSourceMap.
When original source matches generated source for a mapping it's assumed to be mapped char by char allowing to keep finer mappings from sourceMap.
CachedSourceDecorates a Source and caches returned results of map, source, buffer, size and sourceAndMap in memory. updateHash is not cached.
It tries to reused cached results from other methods to avoid calculations, i. e. when source is already cached, calling size will get the size from the cached source, calling sourceAndMap will only call map on the wrapped Source.
new CachedSource(source: Source)
new CachedSource(source: Source | () => Source, cachedData?: CachedData)
Instead of passing a Source object directly one can pass an function that returns a Source object. The function is only called when needed and once.
getCachedData()Returns the cached data for passing to the constructor. All cached entries are converted to Buffers and strings are avoided.
original()Returns the original Source object.
originalLazy()Returns the original Source object or a function returning these.
PrefixSourcePrefix every line of the decorated Source with a provided string.
new PrefixSource(
prefix: String,
source: Source | String | Buffer
)
ConcatSourceConcatenate multiple Sources or strings to a single source.
new ConcatSource(
...items?: Source | String
)
addConcatSource.prototype.add(item: Source | String)
Adds an item to the source.
ReplaceSourceDecorates a Source with replacements and insertions of source code.
The ReplaceSource supports "identity" mappings for child source.
When original source matches generated source for a mapping it's assumed to be mapped char by char allowing to split mappings at replacements/insertions.
replaceReplaceSource.prototype.replace(
start: Number,
end: Number,
replacement: String
)
Replaces chars from start (0-indexed, inclusive) to end (0-indexed, inclusive) with replacement.
Locations represents locations in the original source and are not influenced by other replacements or insertions.
insertReplaceSource.prototype.insert(
pos: Number,
insertion: String
)
Inserts the insertion before char pos (0-indexed).
Location represents location in the original source and is not influenced by other replacements or insertions.
originalGet decorated Source.
CompatSourceConverts a Source-like object into a real Source object.
fromCompatSource.from(sourceLike: any | Source)
If sourceLike is a real Source it returns it unmodified. Otherwise it returns it wrapped in a CompatSource.
FAQs
Source code handling classes for webpack
The npm package webpack-sources receives a total of 31,387,015 weekly downloads. As such, webpack-sources popularity was classified as popular.
We found that webpack-sources demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Security News
Socket’s threat research team has detected six malicious npm packages typosquatting popular libraries to insert SSH backdoors.
Security News
MITRE's 2024 CWE Top 25 highlights critical software vulnerabilities like XSS, SQL Injection, and CSRF, reflecting shifts due to a refined ranking methodology.
Security News
In this segment of the Risky Business podcast, Feross Aboukhadijeh and Patrick Gray discuss the challenges of tracking malware discovered in open source softare.