babel / babel/minify

merge-sibling-variables loses source mapping

Open
#1,046 0 comments 0 reactions 0 assignees View on GitHub
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

Open the contributing 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

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.