cdiggins / myna-parser

Myna Parsing Library
https://cdiggins.github.io/myna-parser
MIT License
79 stars 16 forks source link

2.4.0 no longer works in the browser. #15

Closed bd82 closed 6 years ago

bd82 commented 6 years ago

Reproduce with this snippet:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

// will cause "Uncaught ReferenceError: exports is not defined"
<script src="https://unpkg.com/myna-parser/myna.js"></script>

</body>
</html>

Related to: https://github.com/cdiggins/myna-parser/blob/master/myna.js#L1298

cdiggins commented 6 years ago

Thanks a lot for reporting this!! Fixed: https://cdiggins.github.io/myna-parser/tests/qunit.html

bd82 commented 6 years ago

I think 2.4.2 is broken again while 2.4.1 works just fine.

cdiggins commented 6 years ago

For me it works here: https://cdiggins.github.io/myna-parser/tests/qunit.html any ideas?

bd82 commented 6 years ago

Try to reproduce using the simplest of htmls:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<script src="https://unpkg.com/myna-parser@2.4.2/myna.js"></script>

</body>
</html>
cdiggins commented 6 years ago

Thanks @bd82. I figured out why, I had to make a small change to use Myna with other TypeScript projects which meant I had to change how the modules were defined. You now have to add var exports = {}; before including Myna.js.

See: https://github.com/cdiggins/myna-parser/blob/master/tests/test_browser_unpkg.html

bd82 commented 6 years ago

Using Myna with other TypeScript projects should not affect the need for runtime hacks.

For browser usage I suggest packaging with webpack using UMD module pattern. That is how I package Chevrotain. https://unpkg.com/chevrotain@1.0.1/lib/chevrotain.js

For using Myna with other TypeScript projects you only need to provide a d.ts file. If you implement it using the "export as namespace"

Consumers of Myna will be able to use it with any module system they are using in their tsconfig file.

cdiggins commented 6 years ago

@bd82 When learning TypeScript/JavaScript I initially was repulsed the idea of having to use a tool like webpack to deliver stuff to the web, but I think I will have to be more flexible on this. I appreciate your advice.

bd82 commented 5 years ago

I just used the hack you suggested to update the benchmark page to 2.5.1 and it worked. But not everyone can use that hack as

var exports = {}

is identical to

// modifies GLOBAL state (side effect!)
window.exports = {}

and may break popular libraries using the standard UMD pattern. You may not need webpack, the TypeScript compiler can generate UMD code, that may suffice for your simple scenario.