gajus / gajus/flow-runtime

import t from 'flow-runtime' doesn't get transpiled when sourceType = unambiguous

Open
#242 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
797
Forks
49
PR merge metrics
No merged PRs in 30d

Description

This is a:

- [ ] Bug Report
- [ ] Feature Request
- [ ] Question
- [x] Other

Which concerns:

- [ ] flow-runtime
- [x] babel-plugin-flow-runtime
- [ ] flow-runtime-validators
- [ ] flow-runtime-mobx
- [ ] flow-config-parser
- [ ] The documentation website

---

Putting this summary here in case other people run into this issue, it took me lots of debugging to understand.

So even though the [docs for the `sourceType` option](https://babeljs.io/docs/en/options#sourcetype) state that

> "unambiguous" - Consider the file a "module" if import/export statements are present, or else consider it a "script"

From what I'm seeing, if only *type* imports and exports are present, Babel 7 fails to consider the file a module. It will only consider it a module if there are *value* imports or exports present.

Consequently, the `import t from 'flow-runtime'` statement inserted by `babel-plugin-flow-runtime` doesn't get transpiled into a `require` statement if Babel fails to consider the file a module.

I don't know if there's any way we can fix this from our end.

The workaround is simple at least, just add your own `import t from 'flow-runtime'` declaration to the file.

### `.babelrc`

```json
{
"plugins": [
["@babel/plugin-proposal-decorators", {"legacy": true}],
"babel-plugin-flow-runtime"
],
"presets": [
["@babel/preset-env", {"targets": {"node": "current"}}],
"@babel/preset-flow"
],
"sourceType": "unambiguous"
}
```

### `typeOnly.js`

```js
// @flow

export type ConnectionStatus = 'connecting' | 'connected' | 'error'
```

### What is the current behaviour?

```js
import t from "flow-runtime";
export const ConnectionStatus = t.type("ConnectionStatus", t.union(t.string("connecting"), t.string("connected"), t.string("error")));
```

---

### What is the expected behaviour?

```js
"use strict";

Object.defineProperty(exports, "__esModule", {
value: true
});
exports.ConnectionStatus = void 0;

var _flowRuntime = _interopRequireDefault(require("flow-runtime"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

const ConnectionStatus = _flowRuntime.default.type("ConnectionStatus", _flowRuntime.default.union(_flowRuntime.default.string("connecting"), _flowRuntime.default.string("connected"), _flowRuntime.default.string("error")));

exports.ConnectionStatus = ConnectionStatus;
```
---

### Which package versions are you using?

```
├── @babel/core@7.10.0
├── @babel/plugin-proposal-decorators@7.10.0
├── @babel/preset-env@7.10.0
├── @babel/preset-flow@7.9.0
├── babel-plugin-flow-runtime@0.19.0
└── flow-runtime@0.17.0
```

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.