Require issue after install
See original GitHub issueI installed parcel-plugin-imagemin
and after this I’ve been seeing a lot of errors like what I have pasted below. Before I installed the plugin, my images were loading without any issues, using the same code.
Uncaught Error: Cannot find module 'src/assets/aboutIcon.png'
at newRequire (goAheadAcademyFrontend.e31bb0bc.js:37)
at newRequire (goAheadAcademyFrontend.e31bb0bc.js:21)
at localRequire (goAheadAcademyFrontend.e31bb0bc.js:53)
at About.render (About.js:59)
at finishClassComponent (react-dom.development.js:17160)
at updateClassComponent (react-dom.development.js:17110)
at beginWork (react-dom.development.js:18620)
at HTMLUnknownElement.callCallback (react-dom.development.js:188)
at Object.invokeGuardedCallbackDev (react-dom.development.js:237)
at invokeGuardedCallback (react-dom.development.js:292)
at beginWork$1 (react-dom.development.js:23203)
at performUnitOfWork (react-dom.development.js:22157)
at workLoopSync (react-dom.development.js:22130)
at performSyncWorkOnRoot (react-dom.development.js:21756)
at scheduleUpdateOnFiber (react-dom.development.js:21188)
at updateContainer (react-dom.development.js:24373)
at react-dom.development.js:24758
at unbatchedUpdates (react-dom.development.js:21903)
at legacyRenderSubtreeIntoContainer (react-dom.development.js:24757)
at Object.render (react-dom.development.js:24840)
at Object.parcelRequire.index.js.react (index.js:4)
at newRequire (goAheadAcademyFrontend.e31bb0bc.js:47)
at localRequire (goAheadAcademyFrontend.e31bb0bc.js:53)
at bundle-loader.js:80
Here is my package.json:
{
"dependencies": {
"@babel/polyfill": "^7.10.4",
"@fortawesome/fontawesome-svg-core": "^1.2.30",
"@fortawesome/free-solid-svg-icons": "^5.14.0",
"@fortawesome/react-fontawesome": "^0.1.11",
"classnames": "^2.2.6",
"email-validator": "^2.0.4",
"polished": "^3.6.5",
"prop-types": "^15.7.2",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-modal": "^3.11.2",
"react-router-dom": "^5.2.0",
"react-router-hash-link": "^2.0.0",
"styled-components": "^5.1.1"
},
"devDependencies": {
"@babel/core": "^7.11.1",
"@babel/plugin-proposal-class-properties": "^7.10.4",
"@babel/preset-env": "^7.11.0",
"@babel/preset-react": "^7.10.4",
"@storybook/addon-actions": "^6.0.10",
"@storybook/addon-essentials": "^6.0.10",
"@storybook/addon-links": "^6.0.10",
"@storybook/react": "^6.0.10",
"babel-loader": "^8.1.0",
"parcel-bundler": "^1.12.4",
"parcel-plugin-imagemin": "^4.0.1",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-modal": "^3.11.2",
"react-router-dom": "^5.2.0",
"react-router-hash-link": "^2.0.0",
"styled-components": "^5.1.1"
},
"scripts": {
"start": "parcel index.html",
"build": "parcel build index.html --public-url ./",
"storybook": "start-storybook -p 6006 -s dist",
"build-storybook": "build-storybook"
}
}
My render function contains:
<img
src={require("../assets/aboutIcon.png")}
className="about-icon-img"
alt="about-icon-img"
/>
Here is my folder structure:
Issue Analytics
- State:
- Created 3 years ago
- Comments:5 (1 by maintainers)
Top Results From Across the Web
Fix problems that block programs from being installed or ...
It also fixes corrupted registry keys. First, you'll need to download the troubleshooter. Download troubleshooter. If you see the File Download box when...
Read more >Windows 10 Update Not Installing After Restart System
... Installing After Restart System | Restart Required Windows 10 Fix | 2022Windows 10 has a built-in troubleshooter to check and fix issue....
Read more >[SOLVED] Windows 10 Could Not Complete the Installation + ...
... the issue of Windows could not complete the installation after update ... You can take advantage of the restore point or system...
Read more >Fix an installed Android app that isn't working - Google Support
Try the following steps if an app installed on your phone has any of these problems: Crashing. Won't open. Won't respond. Isn't working...
Read more >9 Installation of the JDK and the JRE on Microsoft Windows ...
This topic includes the following sections: System Requirements for ... The following table provides the disk requirements for the installed features: ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Also when I tried to use import in the About.js file:
I got the same exact error
Same issue here.