Parcel: Parcel 2: production build Uncaught ReferenceError: require is not defined

[Banou26]

🐛 bug report

When running parcel build ./src/index.html, opening the dist build in a browser throws
Uncaught ReferenceError: require is not defined while the dev build(parcel ./src/index.html) work fine

not sure if this'll be of any help but the error gets thrown here in the final build

        }(Rle.default.memo(e, (function(e, t) {
            return Ile.default(e, t)
        }
        ))))
    }
    ;
    var oce, ace, sce = {};
    oce = function() {
        return function e(t, r, n) {
            function i(a, s) {
                if (!r[a]) {
                    if (!t[a]) {
                        var u = require;
                        if (!s && u)
                            return u(a, !0);
                        if (o)
                            return o(a, !0);
                        throw new Error("Cannot find module '" + a + "'")
                    }
                    var l = r[a] = {
                        exports: {}
                    };
                    t[a][0].call(l.exports, (function(e) {
                        return i(t[a][1][e] || e)
                    }
                    ), l, l.exports, e, t, r, n)
                }
                return r[a].exports
            }
            for (var o = require, a = 0; a < n.length; a++) // ERROR THROWN HERE
                i(n[a]);
            return i
        }({
            1: [function(e, t, r) {
                (function(n, i, o, a, s, u, l, c, f) {
                    var d = e("crypto");
                    function p(e, t) {

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

{
  "name": "test",
  "version": "0.0.1",
  "license": "MIT",
  "appModern": "dist/index.html",
  "targets": {
    "appModern": {
      "engines": {
        "browsers": ["last 1 chrome version"]
      }
    }
  },
  "devDependencies": {
    "parcel": "^2.0.0-nightly.118"
  }
  "scripts": {
    "dev": "parcel ./src/index.html --host front-dev.tmds.local",
    "build": "parcel build ./src/index.html"
  }
}

[Banou26]

Adding the --no-scope-hoist flag to the build script fixed the problem

[mischnic]

I guess some dependency is causing this. Please provide a reproduction

[Banou26]

I don't really remember what the problem was now, and it happened on a work project.
I don't know why i didn't provide a repro because now i can't provide one...
I'm stupid lol, closing this i guess

[vasanthdeveloper]

When putting the following code 👇 in a JS file and passing it to Parcel 2.

import { init } from 'aos'

init({
    once: true,
    disable: 'mobile',
})

While doing a production build the dist JS file only outputs 👇

var{init:e}=require("aos");e({once:!0,disable:"mobile"});

As one can clearly see, the imported module isn't getting bundled at all. There was a workaround proposed above, which was, using --no-scope-hoist. It outputs the following code 👇

!function(e,n,o,r,i,t){var u="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:"undefined"!=typeof window?window:"undefined"!=typeof global?global:{},f="function"==typeof u.parcelRequire665b&&u.parcelRequire665b,d="undefined"!=typeof module&&"function"==typeof module.require&&module.require.bind(module);function l(o,r){if(!n[o]){if(!e[o]){var i="function"==typeof u.parcelRequire665b&&u.parcelRequire665b;if(!r&&i)return i(o,!0);if(f)return f(o,!0);if(d&&"string"==typeof o)return d(o);var t=new Error("Cannot find module '"+o+"'");throw t.code="MODULE_NOT_FOUND",t}p.resolve=function(n){return e[o][1][n]||n},p.cache={};var c=n[o]=new l.Module(o);e[o][0].call(c.exports,p,c,c.exports,this)}return n[o].exports;function p(e){return l(p.resolve(e))}}l.isParcelRequire=!0,l.Module=function(e){this.id=e,this.bundle=l,this.exports={}},l.modules=e,l.cache=n,l.parent=f,l.register=function(n,o){e[n]=[function(e,n){n.exports=o},{}]},Object.defineProperty(l,"root",{get:function(){return u.parcelRequire665b}}),u.parcelRequire665b=l;for(var c=0;c<o.length;c++)l(o[c]);var p=l(r);"object"==typeof exports&&"undefined"!=typeof module?module.exports=p:"function"==typeof define&&define.amd&&define((function(){return p}))}({oLWih:[function(e,n,o){"use strict";(0,e("aos").init)({once:!0,disable:"mobile"})},{}]},{},["oLWih"],"oLWih");

Still, the actual dependency imported didn't get bundled. I request @mischnic to re-open the issue.
Happy to give additional info if required.

[mischnic]

@vasanthdeveloper Please share your package.json. You probably have something like main: "..." or engines: {node: "..."} in there and Parcel is automatically not bundling node modules because of that.

[vasanthdeveloper]

Yes, I do have the following set as engines 👇

"engines": {
    "node": "^15.3.0"
},

and main is not set. Should I paste the full package.json it's kinda big?

[vasanthdeveloper]

I removed the engines key and it works like a charm ✨ thank you @mischnic