Akryum / Akryum/vue-cli-plugin-apollo

'regeneratorRuntime is not defined'

Đang mở
#452 2 bình luận 7 reaction 0 người được giao Xem trên GitHub
Ngôn ngữ chính
JavaScript
Star
477
Fork
109
Chỉ số merge pull request
Không có pull request nào được merge trong 30 ngày

Mô tả

As of #296, `vue-cli-plugin-apollo` is broken when using it in environments which don't include [regenerator-runtime](https://www.npmjs.com/package/regenerator-runtime). The reason that this has gone mostly unnoticed (except for #386) seems to be that nearly everyone transpiles their bundles in ways which conceal the fact.

## What causes the issue?

The usage of [async/await](https://github.com/Akryum/vue-cli-plugin-apollo/commit/ee59014fac7b11fbeb094a7a7b051c2647202f48#diff-f56ba3f3c5a871abdefe6b1fadbde8ea278a117fb2654c4c89fa22a0c5308a23L75-L76) in `graphql-client/src/index.js`.

The file is transpiled with `build:graphql-client`, which basically just uses `@babel/preset-env`. This preset includes IE11 and adds calls to `regenerator-runtime`, [presuming that it's globally available](https://github.com/babel/babel/issues/9849#issuecomment-487040428).

Showcase:
* [REPL](https://babeljs.io/en/repl#?browsers=defaults&build=&builtIns=false&spec=false&loose=false&code_lz=MYewdgzgLgBAhhAnmYAxArimBeeSsAUAlDgHwwDeAUDLTAE4CmU69Y8A7nAJawAK9EAFtuERgDomEEABsAbo2JUAvlSA&debug=false&forceAllTransforms=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&timeTravel=false&sourceType=module&lineWrap=true&presets=env&prettier=false&targets=&version=7.12.3&externalPlugins=) of async function with default env preset: includes calls to the non-defined `regeneratorRuntime`.
* [REPL](https://babeljs.io/en/repl#?browsers=defaults%2C%20not%20ie%2011%2C%20not%20ie_mob%2011&build=&builtIns=false&spec=false&loose=false&code_lz=MYewdgzgLgBAhhAnmYAxArimBeeSsAUAlDgHwwDeAUDLTAE4CmU69Y8A7nAJawAK9EAFtuERgDomEEABsAbo2JUAvlSA&debug=false&forceAllTransforms=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&timeTravel=false&sourceType=module&lineWrap=true&presets=env&prettier=false&targets=&version=7.12.3&externalPlugins=) of async function with default env preset minus IE11: does not include calls to `regeneratorRuntime`.

## How to resolve the issue?

I am no expert on distributing packages nowadays. I see two simple possible ways to remove the issue:
* Install regeneratorRuntime and import it in `graphql-client/src/index.js`. The `dist` output is then able to run as distributed, even in IE11 (but probably bloated in size). *Edit: it seems that another / the recommended option for a library would be to add `@babel/plugin-transform-runtime` to `.babelrc`. That would result in [such output](https://babeljs.io/en/repl#?browsers=defaults&build=&builtIns=false&spec=false&loose=false&code_lz=MYewdgzgLgBAhhAnmYAxArimBeeSsAUAlDgHwwDeAUDLTAE4CmU69Y8A7nAJawAK9EAFtuERgDomEEABsAbo2JUAvlSA&debug=false&forceAllTransforms=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&timeTravel=false&sourceType=module&lineWrap=true&presets=env&prettier=false&targets=&version=7.12.3&externalPlugins=%40babel%2Fplugin-transform-runtime%407.12.1).*
* Change the babel config to exclude IE11 as transpile target. The `dist` output would be able to run on its own, except for browsers not supporting async/await.
One could also consider building / shipping two versions, one modern bundle output, and one maximum compatible commonjs output.

I am happy to open PRs in any of the directions described above.

Hướng dẫn đóng góp

Chưa lập chỉ mục được hướng dẫn đóng góp cho kho mã nguồn này

Đánh giá

Issue này chưa được đánh giá.

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.