parcel: Getting `Cannot read property 'js' of null`
Choose one: is this a 🐛 bug report or 🙋 feature request? 🐛
Getting Cannot read property 'js' of null on initial run with npm start but the error goes aways if I make change to any file. But when trying to create a production build with npm run build the same error shows up and fails the build.
🎛 Configuration (.babelrc, package.json, cli command)
"scripts": {
"start": "parcel ./src/index.html",
"build": "parcel build ./src/index.html",
"test": "echo \"Error: no test specified\" && exit 1"
},
"devDependencies": {
"node-sass": "^4.8.3",
"parcel-bundler": "^1.7.0"
}
🤔 Expected Behavior
The build process should complete without any error.
😯 Current Behavior
Build fails with the following error:
🚨 Cannot read property 'js' of null
at JSPackager.addAsset (/Users/sabbirrahman/project/node_modules/parcel-bundler/src/packagers/JSPackager.js:38:41)
at JSPackager.addAssetToBundle (/Users/sabbirrahman/project/node_modules/parcel-bundler/src/packagers/JSPackager.js:125:16)
at JSPackager.writeBundleLoaders (/Users/sabbirrahman/project/node_modules/parcel-bundler/src/packagers/JSPackager.js:141:18)
at JSPackager.end (/Users/sabbirrahman/project/node_modules/parcel-bundler/src/packagers/JSPackager.js:197:20)
at <anonymous>
💁 Possible Solution
🔦 Context
The error happened after I added a new html file and linked it in my index.html file. See the code sample bellow. If I remove index.js from other.html the error goes away but I can’t do that since index.js contains the scss file import which is required for the styling of the other.html page.
💻 Code Sample
index.html
<html>
<body>
<a href="./other.html">Link to another page</a>
<script src="./index.js"></script>
</body>
</html>
other.html
<html>
<body>
<a href="./index.html">Link to home page</a>
<script src="./index.js"></script>
</body>
</html>
index.js
import './index.scss';
🌍 Your Environment
| Software | Version(s) |
|---|---|
| Parcel | 1.7.0 |
| Node | v9.2.0 |
| npm/Yarn | 5.2.0 |
| Operating System | MacOS High Sierra 10.13.3 |
About this issue
- Original URL
- State: closed
- Created 6 years ago
- Reactions: 5
- Comments: 31 (4 by maintainers)
I have the same error.
Not sure why, but in my case I added the
-t nodeoption to parcel and it got passed the issue.Yes it’s a bug I’ve encountered too.
In my case it happens when I use
background-image: url('...')in a .scss file and then runparcel servewith HMR activated. I’ve narrowed it down to the javascript code generated to reload the css (css-loaderamong others), that seems to generate buggy code wheneverurl('...')is in the scss file.I have several guesses as to what might be causing it, the main one being that the bug might be caused by the quotes inside the
urldeclaration, which might not be properly escaped during code generation. Removing those quotes, while breaking the css behaviour, solve the bug, which is why I’m fairly sure it is caused by something among those lines.Also if you make a change in the code and trigger the HMR then it removes the error, and the error will come back when you make a change to the scss file containing the background or in any file that imports it, basically whenever it’s parsed again and generates new faulty js code.
This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 14 days if no further activity occurs.
Still experiencing this issue
Removing the
.cachefolder fixed it for me, but still that’s pretty annoying bug.Hopefully
parcel2 will be functional soon. Had v2 fail profoundly in two different projects recently, so it doesn’t seem to be ready for prime time yet. 😦This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 14 days if no further activity occurs.
https://github.com/quasicomputational/parcel-1158 is a reproducer that’s as small as I could get it. Removing any of the imports makes the symptom vanish, likewise removing any more of
generator.mjsorchunk.js.@devongovett I had a similiar issue, but instead of
'js' of nullit was'html' of null… The issue was the use of%PUBLIC_URL%(<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">) in an app generated by create-react-app. Removing that resolved the issue.Not sure if it’s related, but it might help someone down the road.