Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fengari doesn't work with webpack when targetting browser - dependency on fs #156

Open
roddypratt opened this issue Jun 18, 2019 · 8 comments

Comments

@roddypratt
Copy link

I'm using fengari-web without problems in a browser-side app bundled with webpack 3. When I try pulling in fengari API calls directly, I get these kind of errors.

ERROR in ./node_modules/fengari/src/lauxlib.js
Module not found: Error: Can't resolve 'fs' in 'C:\rascular\WebCentre2\node_modules\fengari\src'
 @ ./node_modules/fengari/src/lauxlib.js 901:15-28
 @ ./node_modules/fengari/src/fengari.js

It seems to be because the conditional if (typeof process !== "undefined") require()s aren't handled by webpack, and the recommended solution seems to be to use __non_webpack_require__

https://hackernoon.com/building-isomorphic-javascript-packages-1ba1c7e558c5

@daurnimator
Copy link
Member

Are you using the distributed bundle?

@roddypratt
Copy link
Author

It looks like not. I was importing fengari separately (which has no distributed bundles?) rather than using the API calls exposed by fengariweb etc. So probably due to my Typescript typing files...

@roddypratt
Copy link
Author

OK, I have it working now, as long as I always import {lua} from "fengari-web" rather than from "fengari"., for example. ( I hadn't previously made the fengari-web typings re-export the fengari libraries, which prevented this)

However, I think this is still an issue, as code running in the browser should still be able to require just the "fengari" module.

@daurnimator
Copy link
Member

However, I think this is still an issue, as code running in the browser should still be able to require just the "fengari" module.

Doesn't webpack do this for you?

@roddypratt
Copy link
Author

If I explicitly import * from "fengari" (which AFAICT has no distributed bundle) then webpack scans the fengari code for "require"d modules and attempts to add them to the bundle. Webpack's not smart enough to ignore conditionally required modules (like lines 485 on of loslib.js). If I import from fengari-web instead it's all OK, as I believe I get the distributed bundle (which somehow avoids this problem?)

@timkurvers
Copy link

timkurvers commented Jul 17, 2019

A potential workaround here is to force webpack into the browser-compatible branch, using the DefinePlugin:

new webpack.DefinePlugin({
  'typeof process':  JSON.stringify('undefined'),
}),

We're currently using this successfully (wowserhq/client@8c61884) but it's worth noting that it may break other parts of the build that actually do rely on process using a typeof-check.

@hmans
Copy link

hmans commented Aug 28, 2019

I wasn't feeling terribly comfortable with the workaround suggested by @timkurvers, so I had a go at trying to fix it within Fengari itself. I'm a bit of a Node/Webpack newbie, so I really hope I chose a sane approach -- if I didn't, please let me know.

PR: #166

@timkurvers
Copy link

Agreed @hmans, definitely safer to fix from within. Like your approach 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants