Strange characters in source code for babael-standalone from unpkg.com

[lukaszewczak]

Choose one: is this a bug report or feature request?

Bug

Hi,

I try to execute this simple example from this react course https://egghead.io/lessons/react-use-jsx-with-react, but unfortunately I receive some error (because of some strange characters in the source code) which makes it impossible to test a solutions.

Input Code

This is my whole example file index.html

<div id="root"></div>
<script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<script type="text/babel">
    const rooteElement = document.getElementById('root');
    const element = <div className="container">Hello world</div>;
    ReactDOM.render(element, rooteElement);
</script>

Babel/Babylon Configuration (.babelrc, package.json, cli command)

Simple script from unpkg.com

<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>

Expected Behavior

To convert jsx into React.createElement

Current Behavior

Example not working, there is an error in the console:

babel.min.js:formatted:6972 Uncaught SyntaxError: Invalid regular expression: /[ªµºÀ-ÖØ-öø-�ˆ-ˑˠ-ˤˬˮͰ-ʹͶͷͺ-ͽͿΆΈ-ΊΌΎ-ΡΣ-ϵϷ-�Ҋ-ԯԱ-Ֆՙա-և�-תװ-ײؠ-يٮٯٱ-ۓەۥۦۮۯۺ-ۼۿ�ܒ-ܯ�-ޥޱߊ-ߪߴߵߺࠀ-ࠕࠚࠤࠨࡀ-ࡘࢠ-ࢴࢶ-ࢽऄ-हऽ�क़-ॡॱ-ঀঅ-ঌ��ও-নপ-রলশ-হঽৎড়�য়-ৡৰৱਅ-ਊ��ਓ-ਨਪ-ਰਲਲ਼ਵਸ਼ਸਹਖ਼-ੜਫ਼ੲ-ੴઅ-��-ઑઓ-નપ-રલળવ-હઽ�ૠૡૹଅ-ଌ��ଓ-ନପ-ରଲଳଵ-ହଽଡ଼�ୟ-ୡୱஃஅ-ஊஎ-�ஒ-கஙசஜஞடணதந-பம-ஹ�అ-ఌఎ-�ఒ-నప-హఽౘ-ౚౠౡಀಅ-ಌಎ-�ಒ-ನಪ-ಳವ-ಹಽೞೠೡೱೲഅ-ഌഎ-�ഒ-ഺഽൎൔ-ൖൟ-ൡൺ-ൿඅ-ඖක-නඳ-රලව-ෆ�-ะาำเ-ๆ�ຂຄງຈຊ�ດ-ທນ-ຟມ-ຣລວສຫອ-ະາຳຽເ-ໄໆໜ-ໟༀཀ-ཇཉ-ཬྈ-ྌက-ဪဿ�-��-�����-��-�ႎႠ-ჅჇ��-ჺჼ-ቈቊ-��-ቖቘቚ-�በ-ኈኊ-��-ኰኲ-ኵኸ-ኾዀዂ-ዅወ-ዖዘ-�ጒ-ጕጘ-�ᎀ-�Ꭰ-��-��-ᙬᙯ-ᙿ�-ᚚᚠ-ᛪᛮ-ᛸᜀ-ᜌᜎ-ᜑᜠ-ᜱ�-��-��-�ក-ឳៗៜᠠ-ᡷᢀ-ᢨᢪᢰ-ᣵᤀ-ᤞ�-ᥭᥰ-ᥴᦀ-ᦫᦰ-ᧉᨀ-ᨖᨠ-ᩔᪧᬅ-ᬳᭅ-ᭋᮃ-ᮠᮮᮯᮺ-ᯥᰀ-ᰣ�-�ᱚ-ᱽᲀ-ᲈᳩ-ᳬᳮ-ᳱᳵᳶᴀ-ᶿḀ-ἕἘ-�ἠ-ὅὈ-��-ὗὙὛ�Ὗ-ώᾀ-ᾴᾶ-ᾼιῂ-ῄῆ-ῌ�-ΐῖ-Ίῠ-Ῥῲ-ῴῶ-ῼ���-ₜℂℇℊ-ℓℕ℘-�ℤΩℨK-ℹℼ-ℿⅅ-ⅉⅎⅠ-ↈⰀ-Ⱞⰰ-ⱞⱠ-ⳤⳫ-ⳮⳲⳳⴀ-ⴥⴧⴭⴰ-ⵧⵯⶀ-ⶖⶠ-ⶦⶨ-ⶮⶰ-ⶶⶸ-ⶾⷀ-ⷆⷈ-ⷎ�-ⷖⷘ-ⷞ々-〇〡-〩〱-〵〸-〼�-ゖ゛-ゟァ-ヺー-ヿㄅ-ㄭㄱ-ㆎㆠ-ㆺㇰ-ㇿ�-䶵一-鿕ꀀ-ꒌ�-ꓽꔀ-ꘌ�-ꘟꘪꘫꙀ-ꙮꙿ-�ꚠ-ꛯꜗ-ꜟꜢ-ꞈꞋ-ꞮꞰ-ꞷꟷ-�ꠃ-ꠅꠇ-ꠊꠌ-ꠢꡀ-ꡳꢂ-ꢳꣲ-ꣷꣻꣽꤊ-ꤥꤰ-ꥆꥠ-ꥼꦄ-ꦲ�ꧠ-ꧤꧦ-ꧯꧺ-ꧾꨀ-ꨨꩀ-ꩂꩄ-ꩋꩠ-ꩶꩺꩾ-ꪯꪱꪵꪶꪹ-ꪽꫀꫂꫛ-�ꫠ-ꫪꫲ-ꫴ�-ꬆꬉ-ꬎꬑ-ꬖꬠ-ꬦꬨ-ꬮꬰ-ꭚꭜ-ꭥꭰ-ꯢ가-힣ힰ-ퟆퟋ-ퟻ豈-舘並-龎ff-stﬓ-ﬗ�ײַ-ﬨשׁ-זּטּ-לּמּנּ�ףּפּצּ-ﮱﯓ-ﴽ�-�ﶒ-ﷇﷰ-ﷻﹰ-ﹴﹶ-ﻼＡ-Ｚ�-ｚｦ-ﾾￂ-ￇￊ-�ￒ-ￗￚ-ￜ]/: Range out of order in character class
    at new RegExp (<anonymous>)
    at Object.<anonymous> (babel.min.js:formatted:6972)
    at t (babel.min.js:formatted:13)
    at Object.t.__esModule (babel.min.js:formatted:28411)
    at t (babel.min.js:formatted:13)
    at Object.<anonymous> (babel.min.js:formatted:2677)
    at t (babel.min.js:formatted:13)
    at Object.e.exports (babel.min.js:formatted:1150)
    at t (babel.min.js:formatted:13)
    at Object.e.exports.version (babel.min.js:formatted:1068)

When I opened directly file from https://unpkg.com/babel-standalone@6.26.0/babel.min.js, I saw this characters directly in the source code:

g=r("break case catch continue debugger default do else finally for function if return switch throw try var while with null true false instanceof typeof void delete new in this let const class extends export import yield super"),b="ªµºÀ-ÖØ-öø-Ë�ˆ-Ë‘Ë -ˤˬˮͰ-ʹͶͷͺ-ͽͿΆΈ-ΊΌΎ-ΡΣ-ϵϷ-Ò�ÒŠ-Ô¯Ô±-Õ–Õ™Õ¡-Ö‡×�-תװ-×²Ø -يٮٯٱ-Û“Û•Û¥Û¦Û®Û¯Ûº-Û¼Û¿Ü�Ü’-ܯÝ�-ޥޱߊ-ßªß´ßµßºà €-à •à šà ¤à ¨à¡€-ࡘࢠ-ࢴࢶ-ࢽऄ-हऽà¥�क़-ॡॱ-ঀঅ-ঌà¦�à¦�ও-নপ-রলশ-হঽৎড়à§�য়-ৡৰৱਅ-ਊà¨�à¨�ਓ-ਨਪ-ਰਲਲ਼ਵਸ਼ਸਹਖ਼-ੜਫ਼ੲ-ੴઅ-àª�àª�-ઑઓ-નપ-રલળવ-હઽà«�ૠૡૹଅ-ଌà¬�à¬�ଓ-ନପ-ରଲଳଵ-ହଽଡ଼à­�à­Ÿ-ୡୱஃஅ-ஊஎ-à®�à®’-கஙசஜஞடணதந-பம-ஹà¯�à°…-ఌఎ-à°�à°’-నప-హఽౘ-ౚౠౡಀಅ-ಌಎ-à²�ಒ-ನಪ-ಳವ-ಹಽೞೠೡೱೲഅ-ഌഎ-à´�à´’-ഺഽൎൔ-ൖൟ-ൡൺ-ൿඅ-ඖක-නඳ-රලව-à·†à¸�-ะาำเ-ๆàº�ຂຄງຈຊàº�ດ-ທນ-ຟມ-ຣລວສຫອ-ະາຳຽເ-ໄໆໜ-ໟༀཀ-ཇཉ-ཬྈ-ྌက-ဪဿá��-á�•á�š-á��á�¡á�¥á�¦á�®-á�°á�µ-á‚�á‚Žá‚ -ჅჇáƒ�áƒ�-ჺჼ-ቈቊ-á‰�á‰�-ቖቘቚ-á‰�በ-ኈኊ-áŠ�áŠ�-ኰኲ-ኵኸ-ኾዀዂ-ዅወ-ዖዘ-áŒ�ጒ-ጕጘ-á�šáŽ€-áŽ�Ꭰ-á�µá�¸-á�½á��-ᙬᙯ-ᙿáš�-áššáš -ᛪᛮ-ᛸᜀ-ᜌᜎ-ᜑᜠ-ᜱá�€-á�‘á� -á�¬á�®-á�°áž€-áž³áŸ—áŸœá  -ᡷᢀ-ᢨᢪᢰ-ᣵᤀ-ᤞá¥�-ᥭᥰ-ᥴᦀ-ᦫᦰ-ᧉᨀ-ᨖᨠ-ᩔᪧᬅ-ᬳᭅ-ᭋᮃ-ᮠᮮᮯᮺ-ᯥᰀ-á°£á±�-á±�ᱚ-ᱽᲀ-ᲈᳩ-ᳬᳮ-ᳱᳵᳶᴀ-ᶿḀ-ἕἘ-á¼�á¼ -ὅὈ-á½�á½�-ὗὙὛá½�Ὗ-ώᾀ-ᾴᾶ-ᾼιῂ-ῄῆ-á¿Œá¿�-á¿“á¿–-Ίῠ-Ῥῲ-ῴῶ-ῼâ�±â�¿â‚�-ₜℂℇℊ-ℓℕ℘-â„�ℤΩℨK-ℹℼ-â„¿â……-â…‰â…Žâ… -ↈⰀ-Ⱞⰰ-ⱞⱠ-ⳤⳫ-ⳮⳲⳳⴀ-ⴥⴧⴭⴰ-ⵧⵯⶀ-ⶖⶠ-ⶦⶨ-ⶮⶰ-ⶶⶸ-ⶾⷀ-ⷆⷈ-â·Žâ·�-â·–â·˜-ⷞ々-〇〡-〩〱-〵〸-〼ã��-ã‚–ã‚›-ã‚Ÿã‚¡-ヺー-ヿㄅ-ㄭㄱ-ㆎㆠ-ㆺㇰ-ㇿã�€-䶵一-鿕ꀀ-ê’Œê“�-ꓽꔀ-ꘌê˜�-ꘟꘪꘫꙀ-ꙮꙿ-êš�êš -ꛯꜗ-ꜟꜢ-ꞈꞋ-ꞮꞰ-ꞷꟷ-ê �ê ƒ-ê …ê ‡-ê Šê Œ-ê ¢ê¡€-ꡳꢂ-ꢳꣲ-ꣷꣻꣽꤊ-ꤥꤰ-ê¥†ê¥ -ꥼꦄ-ꦲê§�ê§ -ꧤꧦ-ꧯꧺ-ꧾꨀ-ꨨꩀ-ê©‚ê©„-ê©‹ê© -ꩶꩺꩾ-ꪯꪱꪵꪶꪹ-ꪽꫀꫂꫛ-ê«�ê« -ꫪꫲ-ê«´ê¬�-ꬆꬉ-ꬎꬑ-ê¬–ê¬ -ꬦꬨ-ꬮꬰ-ê­šê­œ-ꭥꭰ-ꯢ가-힣ힰ-ퟆퟋ-ퟻ豈-ï©­ï©°-龎ff-stﬓ-ﬗï¬�ײַ-ﬨשׁ-זּטּ-לּמּנּï­�ףּפּצּ-ﮱﯓ-ï´½ïµ�-ï¶�ﶒ-ﷇﷰ-ﷻﹰ-ﹴﹶ-ﻼＡ-Ｚï½�-ｚｦ-ﾾￂ-ￇￊ-ï¿�ï¿’-ï¿—ï¿š-ï¿œ",E="‌â€�·̀-ͯ·҃-Ò‡Ö‘-Ö½Ö¿×�ׇׂׅׄØ�-ØšÙ‹-٩ٰۖ-ۜ۟-Û¤Û§Û¨Ûª-Û­Û°-۹ܑܰ-ÝŠÞ¦-ް߀-߉߫-ß³à –-à ™à ›-à £à ¥-à §à ©-à ­à¡™-࡛ࣔ-ࣣ࣡-ःऺ-़ा-à¥�॑-ॗॢॣ०-९à¦�-ঃ়া-ৄেৈো-à§�ৗৢৣ০-৯à¨�-ਃ਼ਾ-ੂੇੈੋ-à©�ੑ੦-ੱੵàª�-ઃ઼ા-ૅે-ૉો-à«�ૢૣ૦-૯à¬�-ଃ଼ା-ୄେୈୋ-à­�ୖୗୢୣ୦-୯ஂா-ூெ-ைொ-à¯�ௗ௦-௯ఀ-ఃా-ౄె-ైొ-à±�ౕౖౢౣ౦-౯à²�-ಃ಼ಾ-ೄೆ-ೈೊ-à³�ೕೖೢೣ೦-೯à´�-ഃാ-ൄെ-ൈൊ-àµ�ൗൢൣ൦-൯ංඃ්à·�-ුූෘ-à·Ÿà·¦-෯ෲෳัิ-ฺ็-๎à¹�-๙ັິ-ູົຼ່-à»�à»�-໙༘༙༠-༩༹༵༷༾༿ཱ-྄྆྇à¾�-ྗྙ-ྼ࿆ါ-ှá�€-á�‰á�–-á�™á�ž-á� á�¢-á�¤á�§-á�­á�±-á�´á‚‚-á‚�á‚�-á‚�á��-á�Ÿá�©-á�±áœ’-᜔ᜲ-᜴á�’á�“á�²á�³áž´-៓áŸ�០-áŸ©á ‹-á �á �-á ™á¢©á¤ -ᤫᤰ-᤻᥆-á¥�á§�-᧚ᨗ-ᨛᩕ-á©žá© -᩿᩼-᪉áª�-᪙᪰-᪽ᬀ-ᬄ᬴-á­„á­�-᭙᭫-᭳ᮀ-ᮂᮡ-á®­á®°-᮹᯦-᯳ᰤ-á°·á±€-᱉á±�-á±™á³�-á³’á³”-᳨᳭ᳲ-᳴᳸᳹᷀-᷵᷻-᷿‿â�€â�”âƒ�-⃥⃜⃡-⃰⳯-⵿⳱ⷠ-〪ⷿ-ã€¯ã‚™ã‚šê˜ -꘩꙯ꙴ-ê™½êšžêšŸê›°ê›±ê ‚ê †ê ‹ê £-ê §ê¢€ê¢�ꢴ-ꣅê£�-ê£™ê£ -꣱꤀-꤉ꤦ-꤭ꥇ-꥓ꦀ-ꦃ꦳-꧀ê§�-꧙ꧥ꧰-꧹ꨩ-ꨶꩃꩌê©�ê©�-꩙ꩻ-ꩽꪰꪲ-ꪴꪷꪸꪾ꪿ê«�ê««-ꫯꫵ꫶ꯣ-ꯪ꯬꯭꯰-꯹ﬞ︀-ï¸�ï¸ -︯︳︴ï¹�-ï¹�ï¼�-９＿",x=new RegExp("["+b+"]"),A=new RegExp("["+b+E+"]");b=E=null

Possible Solution

Context

Try to do simple example from react course on https://egghead.io/lessons/react-use-jsx-with-react

Your Environment

Windows 10, Chrome 62.0.3202.94

[babel-bot]

Hey @lukaszewczak! We really appreciate you taking the time to report an issue. The collaborators
on this project attempt to help as many people as possible, but we're a limited number of volunteers,
so it's possible this won't be addressed swiftly.

If you need any help, or just have general Babel or JavaScript questions, we have a vibrant Slack
community that typically always has someone willing to help. You can sign-up here
for an invite.

[marcioj]

This looks similar to #340. I think adding <meta charset="utf-8"> might make it work.
But looking at the discussion there it should work regardless of the explicit charset config, because the unicode BOM, not sure if it is not included anymore.

[MartinKolarik]

This is an issue with unpkg not sending correct headers. Just replace the unpkg babel link with jsDelivr link and it works: https://cdn.jsdelivr.net/npm/babel-standalone@6.26.0/babel.min.js

[xtuc]

ping @mjackson in case it's an unpkg issue.

[lukaszewczak]

Thank you all, for answers. I use link from @MartinKolarik and it works.

[mjackson]

Thanks for the ping, @xtuc. I just pushed a change that forces all JavaScript served from unpkg to be served with charset=utf-8.

It's pretty unusual for JavaScript to require utf-8 (unpkg has been running for 3 years now w/out it!) but this change should fix the problem for anyone who's using babel-standalone w/out <meta charset="utf-8"> in their HTML

[xtuc]

@mjackson thanks for the fast fix 💯