Простой автономный тест babel.js не работает в Chrome v40 из-за неопределяемых функций «undefined is a function» - PullRequest
Новая
       1

Простой автономный тест babel.js не работает в Chrome v40 из-за неопределяемых функций «undefined is a function»

0 голосов
/ 07 января 2019

Я новичок в babel и просто пытаюсь поиграться с простым браузерным автономным приложением babel.js, но я сталкиваюсь с некоторыми проблемами даже с очень простым примером типа "hello world". Вот некоторый код, который отлично работает в Chrome 70, но завершается с ошибкой «undefined is not function» в Chrome 40: 

<script src="https://unpkg.com/@babel/standalone@7.2.5/babel.js"></script>
<script type="text/babel">
async function test() {}  
console.log("done");
</script>

Вот трассировка стека, снимок экрана со страницы браузера:

enter image description here

А вот и битый код:

enter image description here

Похоже, что это связано с этим вопросом , но я бы подумал, что автономный "автономный" и не потребует каких-либо дополнительных вещей для его заполнения. Если размер файла 5,7 МБ, не следует ли заполнять Object.assign? Может я что-то здесь упускаю?

1 Ответ

0 голосов
/ 07 января 2019

Спасибо за комментарий @ Keith, который дал мне понять, что мне нужно включать polyfills отдельно. Вот рабочий "привет мир" с babel.js: 

<script src="https://polyfill.io/v2/polyfill.js?features=default,es5,es6&flags=gated,always"></script>
<script src="https://unpkg.com/@babel/standalone@7.2.5/babel.js"></script>

<script type="text/babel" data-presets="es2015,es2016,es2017,stage-3">
async function test() { return 10; }  
console.log("done");
</script>

Редактировать : При тестировании с моим реальным кодом я получал сообщения "runtimeGenerator не определен", так что это не полное решение. Я попытался включить его прямо из источника, и это, похоже, сработало, но потом я снова получил «undefined is not function», и поэтому, чтобы спасти то, что осталось от моих волос и здравомыслия, я отошел от компьютера.

Редактировать 2: Вот что мне понадобилось: 

<script type="text/javascript" src="https://cdn.jsdelivr.net/gh/facebook/regenerator/packages/regenerator-runtime/runtime.js"></script>
<script src="https://polyfill.io/v2/polyfill.js?features=default,es5,es6,Array.prototype.@@iterator,Array.prototype.entries,Array.prototype.find,Array.prototype.findIndex,Array.prototype.copyWithin,Array.prototype.findIndex,Array.prototype.includes,Array.prototype.keys,Array.prototype.values,DOMTokenList.prototype.@@iterator,DocumentFragment,Element.prototype.dataset,EventSource,Function.name,HTMLCanvasElement.prototype.toBlob,HTMLDocument,MutationObserver,NodeList.prototype.@@iterator,IntersectionObserver,IntersectionObserverEntry,NodeList.prototype.@@iterator,Object.entries,Object.values,Promise.prototype.finally,RegExp.prototype.flags,String.fromCodePoint,String.prototype.codePointAt,String.prototype.padEnd,String.prototype.padStart,String.prototype.repeat,Symbol.hasInstance,Symbol.isConcatSpreadable,Symbol.match,Symbol.replace,Symbol.search,Symbol.species,Symbol.split,Symbol.toPrimitive,Symbol.toStringTag,console.exception,fetch,screen.orientation,setImmediate&flags=gated,always"></script>
<script src="https://unpkg.com/@babel/standalone@7.2.5/babel.js"></script>
<script>
  var beforeCode = "YOUR ES6+ CODE";
  var afterCode = Babel.transform(beforeCode, {
    presets: ['es2015','es2016','es2017','stage-3'],
    plugins: ['transform-async-to-generator','transform-regenerator'],
  }).code;
  var script = document.createElement("script");
  script.innerHTML = afterCode;
  document.head.appendChild(script);
</script>

Мне также нужно было добавить NodeList.forEach polyfill, который polyfill.io не поддерживает.

...