Skip to content

Parcel build corrupts object literal property value shorthand logic but not parcel watch #7955

@nadhifikbarw

Description

@nadhifikbarw

🐛 bug report

Stumbled upon corrupted logic after transpiling using Parcel, ONLY on parcel build but not parcel watch when using object property value shorthand syntax

When I tried enabling Babel transpiling, both parcel build and parcel watch will work perfectly!

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

{
  "name": "parcel-bug",
  "browserslist": [
    "> 0.5%",
    "not dead",
    "last 2 versions"
  ],
  "targets": {
    "app": {
      "context": "browser",
      "source": "src/app/index.html",
      "distDir": "dist/app"
    }
  }
}

🤔 Expected Behavior

Not have corrupted logic on parcel build, produce consistent logic between parcel build and parcel watch

💻 Code Sample

Reproduceable environment: https://github.com/nadhifikbarw/parcel-bug

The main code is pretty simple, written in CJS.

common/cjsA.js

exports = module.exports = {
  entries: ["cjs-a-entry"],
};

common/cjsB.js

exports = module.exports = {
  entries: ["cjs-b-entry"],
};

common/index.js

"use strict";

const cjsA = require("./cjsA.js");
const cjsB = require("./cjsB.js");

const registry = {
  cjsA,
  cjsB,
};

const getEntry = (type) => {
  const { entries } = registry[type];
  return {
    entries,
    metadata: "value",
  };
};

exports = module.exports = {
  getEntry,
};

These code being used in browser bundling, simply like:

src\app\script.js

"use strict";

import { getEntry } from "../../common";

console.log(getEntry("cjsA"));

The script generated by parcel watch will work perfectly but not with script generated by parcel build where the transpiling corrupted the logic Comparison:

Generated by parcel watch

"use strict";
var cjsA = require("./cjsA.js");
var cjsB = require("./cjsB.js");
// Didn't corrupt the logic
var registry = {
    cjsA: cjsA,
    cjsB: cjsB
};
var getEntry = function(type) {
    var entries = registry[type].entries; // Will return entries as expected when calling getEntry('cjsA')
    return {
        entries: entries,
        metadata: "value"
    };
};
exports = module.exports = {
    getEntry: getEntry
};

Generated by parcel build

var $a9U6j = parcelRequire("a9U6j");

var $3PdFn = parcelRequire("3PdFn");
// Corrupted the logic,
const registry = {
    $a9U6j,
    $3PdFn
};
const getEntry = (type)=>{
    const { entries  } = registry[type]; // Will return undefined when calling getEntry('cjsA')
    return {
        entries,
        metadata: "value"
    };
};
exports = module.exports = {
    getEntry
};

If this is caused by expected behaviour of Parcel's scope hoisting, atleast making sure it's also error when using parcel watch will make it less frustrating, to avoid the bug only reproducible in production but not during development

🌍 Your Environment

Software Version(s)
Parcel 2.4.1
Node 14.18.2
npm v8.5.4
Operating System Windows 10

Metadata

Metadata

Assignees

No one assigned

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions