I'm using React scripts v3. I have this issue whenever I do an action of in the page ( mouse event, forms...) the application keeps downloading chunk.js
This my package.json
{
"version": "0.1.0",
"private": true,
"dependencies": {
"babel-polyfill": "^6.26.0",
"bootstrap": "^4.3.1",
"cors": "^2.8.5",
"lodash.flatten": "^4.4.0",
"lodash.get": "^4.4.2",
"lodash.intersection": "^4.4.0",
"mockdate": "^2.0.2",
"moment": "^2.24.0",
"prop-types": "^15.7.2",
"react": "^16.8.6",
"react-app-polyfill": "^1.0.1",
"react-dom": "^16.8.6",
"react-router": "4.3.1",
"react-router-dom": "4.3.1",
"react-scripts": "^3.0.1",
"recompose": "^0.30.0",
"url-search-params-polyfill": "^6.0.0",
"uuid": "^3.3.2"
},
"scripts": {
"mocks": "cd mocks && npm start",
"start-dotnet": "react-scripts start",
"start": "concurrently \"npm run mocks\" \"react-scripts start\"",
"build": "react-scripts build",
"test": "set NODE_ICU_DATA=node_modules/full-icu&& react-scripts test --env=jsdom",
"test:staged": "npm run test -- --coverage --findRelatedTests --watchAll=false",
"test-coverage": "npm run test -- --coverage --watchAll=false"
},
"husky": {
"hooks": {
"pre-commit": "lint-staged",
"commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
}
},
"lint-staged": {
"*src/**/*.js": [
"prettier --write",
"npm run test:coverage",
"git add"
]
},
"commitlint": {
"extends": [
"@commitlint/config-conventional"
]
},
"eslintConfig": {
"extends": "react-app"
},
"jest": {
"snapshotSerializers": [
"enzyme-to-json/serializer"
]
},
"browserslist": [
">0.2%",
"ie 11",
"not dead",
"not op_mini all"
],
"devDependencies": {
"@commitlint/cli": "^8.0.0",
"@commitlint/config-conventional": "^8.0.0",
"concurrently": "^4.1.0",
"enzyme": "^3.9.0",
"enzyme-adapter-react-16": "^1.12.1",
"enzyme-to-json": "^3.3.5",
"eslint-plugin-react-hooks": "^1.6.0",
"full-icu": "^1.3.0",
"husky": "^2.4.1",
"jest": "^24.7.1",
"jest-cucumber": "^2.0.11",
"lint-staged": "^8.2.1",
"node-sass": "^4.11.0",
"prettier": "^1.18.2"
}
}
Does anyone have an idea about this issue?
If you are encountering this error as a user of an application, the simplest way to resolve it is to clear your browser cache (and also restart it for good measure) and try again. If the error was because your browser had cached older files, this should fix the issue.
A "ChunkLoadError" generally means that a checksum failed for a javascript file. These errors occur when the browser requests a JS code chunk, and receives a response whose checksum does not match the expected “integrity=…” attribute associated with the <script> tag that refers to it.
Chunks allow us to separate our codes into bundles, which are a group of related chunks packaged into a single file. Tools such as Create React App, Gatsby, and Next. js use webpack to bundle applications. Bundlers like webpack import all of the application files and merge them into a single bundle.
I ran into the same issue, where it kept on requesting for chunk. It happened because there was a reference issue inside my JS chunk that I was lazy loading. So I was lazy loading page data, and inside the JS for that, I was doing an import to a file that did not exists. And that lead to this issue.
Fixing that fixed it for me.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With