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鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

Babel (babel-preset-env) breaks inlining via fs.readFileSync(...) #106

Closed
simoncave opened this issue Dec 7, 2017 · 0 comments

Comments

Projects
None yet
3 participants
@simoncave
Copy link

commented Dec 7, 2017

Repro project: https://github.com/simoncave/parcel-babel-inline-test

馃 Expected Behavior

According to Parcel's "Assets" documentation:

If you want to inline a file into the JavaScript bundle instead of reference it by URL, you can use the Node.js fs.readFileSync API to do that. The URL must be statically analyzable, meaning it cannot have any variables in it (other than __dirname and __filename).

When successful, the inlining should directly replace fs.readFileSync(...) with the asset being inlined. In the case of this example, it should replace the call with "World".

This inlining feature should work regardless of how the code is transformed, provided the transformation is not doing anything that should explicity modify the usage pattern expressed above (in short: it should work with babel-preset-env).

馃槸 Current Behavior

This appears to break when using Babel, or at least when using babel-preset-env with module transpilation enabled. The assets transformation does not replace the call to fs.readFileSync(...). Instead, the code is left untransformed, resulting in the following error:

TypeError: _fs2.default.readFileSync is not a function. (In '_fs2.default.readFileSync(__dirname + '/name.txt', 'utf8')', '_fs2.default.readFileSync' is undefined)

Workaround

This issue can be avoided by disabling the es6-modules-amd transformation. Example .babelrc:

{
  "presets": [
    ["env", {
      "modules": false
    }]
  ]
}

Parcel does its own module transpilation, so doing so with Babel is redundant and also seems to be the cause of this issue. One way to resolve this issue would be for Parcel to detect module transpilation in a user's .babelrc and provide instructions for disabling it. Another way would be to improve Parcel's matching of fs.readFileSync(...) such that it can succeed after module transpilation.

馃帥 Configuration

  • Deps

    parcel-inline-test@0.0.0
    鈹溾攢鈹 babel-preset-env@1.6.1
    鈹溾攢鈹 node-pre-gyp@0.6.39 extraneous
    鈹斺攢鈹 parcel-bundler@1.0.3
    
  • .babelrc

    {
      "presets": ["env"]
    }
  • Code

    const name = fs.readFileSync(__dirname + '/name.txt', 'utf8');
    document.body.innerHTML = `Hello, ${name}! Inlining via fs.readFileSync is working!`;

馃實 Your Environment

Software Version(s)
Parcel v1.0.3
Node v8.9.1
npm/Yarn v5.5.1/v1.3.2
Operating System macOS 10.13 (17A405)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can鈥檛 perform that action at this time.