parcel-bundler / parcel

The zero configuration build tool for the web. 📦🚀
https://parceljs.org
MIT License
43.28k stars 2.26k forks source link

Unexpected token punc «.», expected punc «(» (compiling @nteract/data-explorer) #7090

Open thomasjm opened 2 years ago

thomasjm commented 2 years ago

🐛 bug report

I'm trying to build a package that depends on @nteract/data-explorer. When building with optimization, I get an error from Terser.

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

{
  "name": "parceltest",
  "version": "1.0.0",
  "source": "src/index.html",
  "scripts": {
    "build": "parcel build"
  },
  "dependencies": {
    "@nteract/data-explorer": "^8.2.12",
    "parcel": "^2.0.0",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "styled-components": "^5.3.1"
  }
}

🤔 Expected Behavior

Should build successfully.

😯 Current Behavior

🚨 Build failed.

@parcel/optimizer-terser: Unexpected token punc «.», expected punc «(»

  /tmp/parcel-optimize-failure/node_modules/element-resize-event/index.js:17:24
    16 | 
  > 17 | var _exports = function exports(element, fn) {
  >    |                        ^ Unexpected token punc «.», expected punc «(»
    18 |   var window = this
    19 |   var document = window.document

  💡 It's likely that Terser doesn't support this syntax yet.

I think the sourcemap is hiding the details there, and what it's trying to do is call module.exports as a function.

💻 Code Sample

Full repro here: https://github.com/thomasjm/parcel-optimize-failure

git clone git@github.com:thomasjm/parcel-optimize-failure.git
cd parcel-optimize-failure
npm install && npm run build

🌍 Your Environment

Software Version(s)
Parcel 2.0.0
Node v14.18.1
npm/Yarn 6.14.15
Operating System Ubuntu 21.04
mischnic commented 2 years ago

Reproduction:

// index.js
const x = import("./x.js");
console.log(x);

// x.js
module.exports = function exports() {};

Outputs:

parcelRequire.register("j0Joe", function(module, exports) {
  module.exports = function module.exports() {};
});

(So the problem here is that function exports collides with the CJS exports binding in the current logic)

I think the sourcemap is hiding the details there

Indeed. BTW, you can pass --no-source-maps to prevent the codeframe from being mapped back to the source)

pastelsky commented 2 years ago

Came across this as well. What does a fix involve?

thomasjm commented 2 years ago

For me, I actually switched to a different bundler after discovering this and a couple other instances where swc was just miscompiling my TypeScript.

alexeyraspopov commented 2 years ago

Neither Parcel nor @nteract/data-explorer (which uses Semiotic 1.x) responsible for this issue. The root cause is not yet fixed though: https://github.com/KyleAMathews/element-resize-event/pull/38

Haegin commented 1 year ago

I'm running into a similar issue, but I'm not using the @ntract/data-explorer package, for me it's failing in core-js.

❯ make build
yarn install
yarn install v1.22.17
[1/4] Resolving packages...
success Already up-to-date.
Done in 0.30s.
yarn build
yarn run v1.22.17
$ parcel build index.html
🚨 Build failed.

@parcel/optimizer-terser: Unexpected token punc «.», expected punc «(»

  portal/node_modules/@babel/runtime-corejs2/node_modules/core-js/library/modules/_for-of.js:9:4
     8 | var RETURN = {};
  >  9 | var exports = module.exports = function (iterable, entries, fn, that, ITERATOR) {
  >    |    ^ Unexpected token punc «.», expected punc «(»
    10 |   var iterFn = ITERATOR ? function () { return iterable; } : getIterFn(iterable);
    11 |   var f = ctx(fn, that, entries ? 2 : 1);

  💡 It's likely that Terser doesn't support this syntax yet.

error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
make: *** [Makefile:47: build] Error 1

portal on  parcel-v2 [$!?] via  v14.18.2 took 18s
❯ yarn build --no-source-maps
yarn run v1.22.17
$ parcel build index.html --no-source-maps
🚨 Build failed.

@parcel/optimizer-terser: Unexpected token punc «.», expected punc «(»

    32402 | var $7423dc4ee6de0a1e$var$RETURN = {};
  > 32403 | module.exports(iterable, entries, fn, that, ITERATOR) {
  >       |      ^ Unexpected token punc «.», expected punc «(»
    32404 |     var iterFn = ITERATOR ? function iterFn() {
    32405 |         return iterable;

  💡 It's likely that Terser doesn't support this syntax yet.

error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
diced-dev commented 1 year ago

I'm experiencing the exact same error as @Haegin with core-js for-of

DarylBuckle commented 1 year ago

I experienced the same issue as @Haegin. Works fine when using the --no-scope-hoist flag so able to work around using that.

avoguga commented 1 year ago

Same error here. Is there any alternative to this error without having to use the --no-scope-hoist flag?

avoguga commented 9 months ago

Any workaround to this without using the --no-scope-hoist flag? This works fine to me but my app gets heavier without it