experimental-scope-hoisting throw error: ReferenceError: require is not defined

[wulucxy]

🐛 bug report

when I enable experimental-scope-hoisting，the result will throw error:

ReferenceError: require is not defined

🎛 Configuration (.babelrc, package.json, cli command)

// .babelrc
{
  "presets": [
    ["@babel/env"],
    "@babel/typescript",
    ["@babel/react"]
  ],
  "plugins": [
    ["@babel/transform-runtime", {
      "corejs": 2
    }],
    "@babel/syntax-dynamic-import",
    ["@babel/proposal-decorators", {"legacy": true}],
    ["@babel/proposal-class-properties"],
    ["import", { "libraryName": "antd", "style": true, "libraryDirectory": "es" }]
  ],
  "env": {
    "development": {
      plugins: ["react-hot-loader/babel"]
    }
  },
  "sourceMaps": true,
  "retainLines": true
}

// package.json
build": "parcel build src/public/index.html --no-source-maps --experimental-scope-hoisting --no-minify",

🤔 Expected Behavior

enable --experimental-scope-hoisting should not throw error。

😯 Current Behavior

enable --experimental-scope-hoistingthrow error： ReferenceError: require is not defined

💁 Possible Solution

🔦 Context

💻 Code Sample

🌍 Your Environment

Software	Version(s)
Parcel	1.12.3
Node	10.14.1
npm/Yarn	6.4.1
Operating System	macOS

[mischnic]

Could you please provide a reproduction code sample? This is very likely related to https://www.npmjs.com/package/babel-plugin-import

[mjl]

Just had this happen to me. It happens with a very very minimal "app.js" as follows with

node_modules/.bin/parcel build --out-dir ../static --experimental-scope-hoisting app.js

import Vue from "vue";
import BootstrapVue from 'bootstrap-vue';
Vue.use(BootstrapVue);

(needs "bootstrap-vue": "^2.0.4", "vue": "^2.6.10")

[TakanashiOuken]

Same issue here. No Solution for this? Seems like if I have import _ from "lodash"; parcel will generate a line var Buffer = require("buffer").Buffer; without adding require

[mjl]

Same issue here. No Solution for this?

At least a workaround. In my html file, I do

 <script type="text/javascript">
 window.require = function(e) { console.debug("require hack still 

required //", e); return undefined; };

before loading any compiled JS, that at least allows things to proceed.

Cheers!

[TakanashiOuken]

Same issue here. No Solution for this? At least a workaround. In my html file, I do before loading any compiled JS, that at least allows things to proceed. Cheers!

Nice evil walk around. I turned to lodash-es to fix this issue but brings me to a next issue... Seems like _.clone will cause errors with tree shaking. $xxx$var$arrayBufferTag is undefined Orz

[darioielardi]

same issue here: $NYPs$var$arrayBufferTag is not defined

[TakanashiOuken]

same issue here: $NYPs$var$arrayBufferTag is not defined

Remove all use of .clone relater functions with spread operator. I had to get rid of .omit

[darioielardi]

Unfortunately I'm not even using lodash, and I can't figure out what's causing the error.