Require issue after install

shail commented 4 years ago

I 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:

shail commented 4 years ago

Also when I tried to use import in the About.js file:

import aboutIconimg from "../assets/aboutIcon.png";

I got the same exact error

DeMoorJasper commented 4 years ago

Please provide some way to reproduce this

joshbedo commented 3 years ago

Same issue, after I run build with Parcel and run an HTTP server in the /dist directory the page doesn't load and I get this error. Can't seem to import images.

To reproduce import any image and run Parcel build.

allangrds commented 3 years ago

Same issue here.

shariult commented 3 years ago

Same issue here. When I try to import images via JavaScript it does not work. Example, import img1 from "./img/a.png"; This is such an awesome plugin but can not use it for this reason, please fix this

DeMoorJasper / parcel-plugin-imagemin

Require issue after install #94