babel / babel/minify

Cannot read property 'end' of null

Open
#847 4 comments 1 reaction 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**

I don't know what causes this bug. I can only tell the symptoms.

I get this error when I declare and initialize a variable before the React component. It occurs even if I am not using that variable anywhere.

If I export that variable or declare the variable (without exporting) after the React Component, the error doesn't occur. Another way to prevent the error is to disable the plugin `minify-constant-folding`.

**To Reproduce**

Since I don't know what exactly causes the bug, I cannot give an MWE.

**Actual Output**

`Cannot read property 'end' of null`

**Expected Output**

No errors.

**Stack Trace**

Here is how the stack looks like:
```
ERROR in ./.tsx
Module build failed: TypeError: .tsx: Cannot read property 'end' of null
at _evaluate (node_modules\babel-traverse\lib\path\evaluation.js:159:58)
at evaluate (node_modules\babel-traverse\lib\path\evaluation.js:65:17)
at NodePath.evaluate (node_modules\babel-traverse\lib\path\evaluation.js:41:15)
at evaluateIdentifier (node_modules\babel-helper-evaluate-path\lib\index.js:129:15)
at evaluate (node_modules\babel-helper-evaluate-path\lib\index.js:21:12)
at PluginPass.Expression (node_modules\babel-plugin-minify-constant-folding\lib\index.js:165:21)
at PluginPass.newFn (node_modules\babel-traverse\lib\visitors.js:318:17)
at newFn (node_modules\babel-traverse\lib\visitors.js:276:21)
at NodePath._call (node_modules\babel-traverse\lib\path\context.js:76:18)
at NodePath.call (node_modules\babel-traverse\lib\path\context.js:48:17)
at NodePath.visit (node_modules\babel-traverse\lib\path\context.js:105:12)
at TraversalContext.visitQueue (node_modules\babel-traverse\lib\context.js:150:16)
at TraversalContext.visitMultiple (node_modules\babel-traverse\lib\context.js:103:17)
at TraversalContext.visit (node_modules\babel-traverse\lib\context.js:190:19)
at Function.traverse.node (node_modules\babel-traverse\lib\index.js:114:17)
at NodePath.visit (node_modules\babel-traverse\lib\path\context.js:115:19)
at TraversalContext.visitQueue (node_modules\babel-traverse\lib\context.js:150:16)
at TraversalContext.visitMultiple (node_modules\babel-traverse\lib\context.js:103:17)
at TraversalContext.visit (node_modules\babel-traverse\lib\context.js:190:19)
at Function.traverse.node (node_modules\babel-traverse\lib\index.js:114:17)
at NodePath.visit (node_modules\babel-traverse\lib\path\context.js:115:19)
at TraversalContext.visitQueue (node_modules\babel-traverse\lib\context.js:150:16)
at TraversalContext.visitSingle (node_modules\babel-traverse\lib\context.js:108:19)
at TraversalContext.visit (node_modules\babel-traverse\lib\context.js:192:19)
at Function.traverse.node (node_modules\babel-traverse\lib\index.js:114:17)
at NodePath.visit (node_modules\babel-traverse\lib\path\context.js:115:19)
at TraversalContext.visitQueue (node_modules\babel-traverse\lib\context.js:150:16)
at TraversalContext.visitMultiple (node_modules\babel-traverse\lib\context.js:103:17)
at TraversalContext.visit (node_modules\babel-traverse\lib\context.js:190:19)
at Function.traverse.node (node_modules\babel-traverse\lib\index.js:114:17)
at NodePath.visit (node_modules\babel-traverse\lib\path\context.js:115:19)
at TraversalContext.visitQueue (node_modules\babel-traverse\lib\context.js:150:16)
at TraversalContext.visitSingle (node_modules\babel-traverse\lib\context.js:108:19)
at TraversalContext.visit (node_modules\babel-traverse\lib\context.js:192:19)
at Function.traverse.node (node_modules\babel-traverse\lib\index.js:114:17)
at NodePath.visit (node_modules\babel-traverse\lib\path\context.js:115:19)
```

**Configuration**

I write my code in Typescript with `target` and `module` both set to `esnext` in `tsconfig.json`.
I package the code with webpack using `ts-loader` and output of `ts-loader` passed to `babel-loader`.

The `babel-loader` uses `babel-preset-minify`. Here are the other babel packages:

"babel-cli": "6.26.0",
"babel-core": "6.26.3",
"babel-loader": "7.1.4",
"babel-plugin-lodash": "3.3.2",
"babel-plugin-transform-builtin-extend": "1.1.2",
"babel-plugin-webpack-alias": "2.1.2",
"babel-polyfill": "6.26.0",
"babel-preset-env": "1.7.0",
"babel-preset-minify": "0.4.2",
"babel-preset-react": "6.24.1",
"babel-preset-react-optimize": "1.0.1",
"babel-preset-stage-2": "6.24.1"

babelrc:

I pass this config to the Webpack `babel-loader`.

```json5
{
"babelrc": false,
"cacheDirectory": true,
"presets": [
"minify",
"react-optimize",
[
"env",
{
"modules": false,
"loose": true,
"useBuiltIns": true,
"debug": false
}
],
"react",
"stage-2"
],
"plugins": [
[
"builtin-extend",
{
"globals": [
"Error"
]
}
],
"lodash"
]
}
```

**Possible solution**

1. `export` the variable
1. remove the variable declaration and move the values right in the code.
1. disable the plugin `minify-constant-folding` by passing in the option `evaluate` as false. See [this](https://github.com/babel/minify/tree/master/packages/babel-preset-minify#options).

**Additional context**

It occurs in `evaluation.js` in babel-traverse when `binding.path.node` is `null`.

![image](https://user-images.githubusercontent.com/1428826/40042116-dc4eadca-583d-11e8-9325-6fd587c33680.png)

This is how `binding.path` looks like:
![image](https://user-images.githubusercontent.com/1428826/40041671-748f66d0-583c-11e8-8078-801035cde60c.png)

Let me know if I you need more information.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.