merge-sibling-variables loses source mapping
- Dominant language
- JavaScript
- Stars
- 4.4k
- Forks
- 217
- PR merge metrics
- No merged PRs in 30d
Description
**Describe the bug**
The plugin `babel-plugin-transform-merge-sibling-variables` does not maintain source mapping when merging sibling variable declarators into a single declaration after `babel-plugin-transform-modules-commonjs` has been applied.
## To Reproduce
Minify a file that has been processed with `babel-plugin-transform-modules-commonjs`. If the original file has **more than one** import statement, the mapping will be lost.
### Minimal code to reproduce the bug
**index.js.map**
```js
import { abc } from 'abc';
import { xyz } from 'xyz';
```
### Actual Output
**index.out.js**
```js
"use strict";
var _abc = require("abc"),
_xyz = require("xyz");
//# sourceMappingURL=index.out.js.map
```
**index.out.js.map**
```json
{
"version": 3,
"file": "index.actual.js",
"names":
[],
"sources":
[
"index.js"
],
"sourcesContent":
[
"import { abc } from 'abc';\nimport { xyz } from 'xyz';"
],
"mappings": ""
}
```
### Expected Output
**index.out.js**
```js
"use strict";
var _abc = require("abc"),
_xyz = require("xyz");
//# sourceMappingURL=index.out.js.map
```
**index.out.js.map**
```json
{
"version": 3,
"file": "index.expected.js",
"names":
[
"_abc",
"require",
"_xyz"
],
"sources":
[
"index.js"
],
"sourcesContent":
[
"import { abc } from 'abc';\nimport { xyz } from 'xyz';"
],
"mappings": ";;IAAAA,IAAA,GAAAC,OAAA,OAA0B;EAC1BC,IAAA,GAAAD,OAAA,OAA0B"
}
```
### Configuration
How are you using babel-minify?
```bash
$ babel index.js -o index.out.js
```
babel-minify version: `0.5.2`
babel version : `7.21.0`
babel-plugin-transform-modules-commonjs: `8.0.11`
babel-plugin-transform-merge-sibling-variables: `6.9.5`
**babelrc**
```json5
{
"sourceMaps": true,
"plugins": [
"@babel/plugin-transform-modules-commonjs",
"babel-plugin-transform-merge-sibling-variables",
]
}
```
**package.json**
```json
{
"devDependencies": {
"@babel/cli": "7.21.0",
"@babel/core": "7.21.0",
"babel-minify": "0.5.2",
"plugin-transform-modules-commonjs": "8.0.11"
}
}
```
# Possible solution
## This pull request: https://github.com/babel/minify/pull/1047
You can use the link below to inspect the mappings for a given output file and sourcemap.
https://evanw.github.io/source-map-visualization/#MTEwACJ1c2Ugc3RyaWN0IjsKCnZhciBfYWJjID0gcmVxdWlyZSgiYWJjIiksCiAgX3h5eiA9IHJlcXVpcmUoInh5eiIpOwoKLy8jIHNvdXJjZU1hcHBpbmdVUkw9aW5kZXguZXhwZWN0ZWQuanMubWFwMjQ1AHsidmVyc2lvbiI6MywiZmlsZSI6ImluZGV4LmV4cGVjdGVkLmpzIiwibmFtZXMiOlsiX2FiYyIsInJlcXVpcmUiLCJfeHl6Il0sInNvdXJjZXMiOlsiaW5kZXguanMiXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgYWJjIH0gZnJvbSAnYWJjJztcbmltcG9ydCB7IHh5eiB9IGZyb20gJ3h5eic7Il0sIm1hcHBpbmdzIjoiOztJQUFBQSxJQUFBLEdBQUFDLE9BQUEsT0FBMEI7RUFDMUJDLElBQUEsR0FBQUQsT0FBQSxPQUEwQiJ9
https://evanw.github.io/source-map-visualization/
alternative tool:https://sokra.github.io/source-map-visualization/
Contributor guide
Research direction
Reproduce the issue with the shown babelrc, index.js input, Babel 7.21.0, and babel-plugin-transform-modules-commonjs before reviewing babel-plugin-transform-merge-sibling-variables. Compare the actual and expected source maps, then inspect pull request #1047 for the proposed direction. Done means merged sibling declarations retain the expected source mappings.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- tooling
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 20/100