Uncaught TypeError: (xxxx) is not a function

[ghost]

🐛 bug report

When I start the parcel dev server after a night or something, and open up my browser, randomly I get a "Uncaught TypeError: **** is not a function". It happend with 3 different things the past days, and it's getting annoying. Workaround rm -rf .cache dist

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

.babelrc

{
  "presets": ["stage-0", "env", "react"],
  "plugins": ["transform-class-properties"]
}

package.json

{
  "name": "frontend-graphql",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "apollo-cache-inmemory": "^1.2.2",
    "apollo-client": "^2.3.2",
    "apollo-link": "^1.2.2",
    "apollo-link-context": "^1.0.8",
    "apollo-link-error": "^1.1.0",
    "apollo-link-http": "^1.5.4",
    "babel-plugin-transform-class-properties": "^6.24.1",
    "babel-polyfill": "^6.26.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-0": "^6.24.1",
    "graphql": "^0.13.2",
    "graphql-tag": "^2.9.2",
    "react": "^16.4.0",
    "react-apollo": "^2.1.4",
    "react-dom": "^16.4.0",
    "react-router-dom": "^4.3.1"
  },
  "scripts": {
    "start": "parcel public/index.html"
  },
  "devDependencies": {
    "parcel-bundler": "^1.9.4"
  }
}

🤔 Expected Behavior

not error and work correctly

😯 Current Behavior

read the report ^^

💻 Code Sample

https://gitlab.com/homework-manager/hwm-frontend

🌍 Your Environment

Software	Version(s)
Parcel	1.9.4
Node	10.5.0
npm/Yarn	Yarn 1.7.0
Operating System	Arch Linux // kernel 4.17.2-1-ARCH

[ghost]

Also, in an (probably?) unrelated issue, most source maps are broken (showing other files, etc)

[buronnie]

@makmm Do you have to leave the dev server running for a few hours in order to reproduce the issue? I tried it on my side and cannot reproduce it.

[ghost]

@buronnie It's weird, it mostly happends when I come back other day, turn on my pc and start parcel.

[ghost]

@buronnie It just happend again but while I was coding, with this error this time (it's like a variant?)

[RobertWHurst]

I've also encountered this quite often. I'm using vue, with pug and scss. Deleting the .cache directory resolves the issue.

[alexander-travov]

I run into the same problem:

After removing .cache I build my app and everything is working just fine. Then I touch one of the modules (product.js in that case), changing nothing in the source, and build output gives me an error.

Diff between builds shows that with cache parcel uses same ids for different modules:

without cache < },{... ,"./product":8,"./locator":9}]},{},[1], null)
---
with cache    > },{... ,"./product":9,"./locator":9}]},{},[1], null)

Building with --no-cache gives correct bundle every time.

@emilniklas in #1596 tells about the same behaviour.

parcel 1.9.4 node 8.11.2 npm 6.1.0 Ubuntu linux

[agentcooper]

Had the same issue. Downgrading to 1.8.1 helps.

[safareli]

after downgrading to 1.8.1 and with no cache flag still have such issues on parcel build but parcel start works on 1.8.1

[RobertWHurst]

@devongovett, I thought I'd ping you here to bring this one to your attention if you haven't seen it yet. This bug can be worked around, but it more or less completely breaks parcel until the cache directory deleted.

[ghost]

Can this be related to the sourcemap issue I'm having?

[safareli]

On version 1.8.1 If I'm using: parcel build --no-minify --no-source-maps --no-cache index.html

Then output is fine. But if you remove --no-minify: parcel build --no-source-maps --no-cache index.html Then I see ReferenceError: e is not defined 551a5bcc-5069-e44a-90de-563f1fa674eb:1:60755

But on 1.7.1 parcel build --no-source-maps --no-cache index.html

results in similar error: ReferenceError: t is not defined 3f5c2c76-cd87-aa43-b9df-72208890eb7b:1:60755

[devongovett]

I believe this is related to storing asset ids in the cache. Should be fixed by https://github.com/parcel-bundler/parcel/pull/1694. Would be great if someone could help verify!

[ghost]

hey @devongovett That's great, how can I help verifying?

[ghost]

I just tried it very briefly and it seems to work, I'm gonna keep testing it in some days but for now, sourcemaps are finally working, even with breakpoints... pretty cool!

[devongovett]

Released in v1.9.5.

[azizali]

@devongovett This fixed it for me.

[joseluisq]

I'm facing a similar issue with Parcel build v1.12.4 and latest React v16.13.1.

parcel build \
    --no-source-maps \
    --no-autoinstall \
    --no-cache \
        public/index.html

  "dependencies": {
    "@ant-design/icons": "^4.1.0",
    "antd": "^4.6.2",
    "classcat": "^4.0.2",
    "geojson": "^0.5.0",
    "identity-obj-proxy": "^3.0.0",
    "leaflet": "^1.6.0",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-leaflet": "^2.7.0",
    "react-router-dom": "^5.2.0"
  }

[kykungz]

@joseluisq Have you solved this problem? I'm using the same version of Parcel and React as yours, and using antd too. My errors are on the same line as yours too (h is not a function).

[joseluisq]

@kykungz basically this issue was not addressed properly and should be re-opened.

My "workaround" was just skipping the minify process using the --no-minify flag and then invoking Terser directly.

~> parcel build \
        --no-minify \
        --no-source-maps \
        --no-autoinstall \
        --no-cache \
                public/index.html

~> terser \
        --compress \
        --mangle \
        --toplevel \
        -- dist/app.*.js > dist/app.js

It seems like something weird is happening during minify process on Parcel side.

[garritfra]

@joseluisq how did you manage to embed the script generated by terser into the document?

[joseluisq]

@garritfra just using a "simple" command to search and replace something like:

sed -i -E 's/<script src=\"\/app\.(.+)\"><\/script>/<script src=\"app\.js\"><\/script>/g' \
        dist/index.html

[garritfra]

I had some other issues (e.g. seds -i flag has a different use on macos), but here's my final workaround:

parcel build \
    --no-minify \
    --no-source-maps \
    --no-autoinstall \
    --no-cache \
        public/index.html

terser \
    --compress \
    --mangle \
    --toplevel \
    -- dist/src.*.js > dist/app.js

cat dist/index.html

sed -E 's/<script src=\"[\.\/]?\/src\.(.+)\"><\/script>/<script src=\"app\.js\"><\/script>/g' dist/index.html | tee dist/index.html

It's unfortunate that this is necessary though.

[chienniman]

I spent nearly five hours debugging to find the error "C.fontStyle is not defined" in the React src code, but unfortunately, I couldn't find any clues. The issue seems to be related to Parcel encountering an error during code minification. In the 2023 version, you must use --no-optimize to disable the optimization in building process. parceljs.org/features/cli