🐛 bug report

When parcel finish the build in the browser i found:

Uncaught Error: Cannot find module './dist/react-pixi.module-dev' at newRequire (src.a2b27638.js:39) at localRequire (src.a2b27638.js:55) at Object.parcelRequire.node_modules/@inlet/react-pixi/module.js (module.js:1) at newRequire (src.a2b27638.js:49) at localRequire (src.a2b27638.js:55)

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

{
  "presets": [
    [
      "es2015",
      {
        "loose": true,
        "modules": false
      }
    ],
    "stage-2"
  ],
  "plugins": [
    "transform-decorators-legacy",
    "transform-class-properties",
    "transform-react-jsx"
  ]
}

{
  "name": "argentum online in react",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "start": "npm run copy && parcel index.html --out-dir dist  ",
    "build": "parcel build index.html --public-url ./",
    "lint": "npx eslint --fix --ext jsx,js client",
    "copy": "npm run scss-compile && npm run copyGraphics && npm run copyAudio && npm run copyIndex && npm run copyMaps",
    "copyIndex": "copyfiles --flat --verbose --soft ./resources/indices/*.json dist/indices",
    "copyGraphics": "copyfiles --flat --verbose --soft ./resources/graficos/*.png dist/graficos",
    "copyAudio": "copyfiles --flat --verbose --soft ./resources/audio/sonidos/*.webm dist/audio/sonidos",
    "copyMaps": "copyfiles --flat --verbose --soft ./resources/mapas/*.json dist/mapas",
    "scss-compile": "node-sass --include-path scss resources/css/main.scss  resources/css/main.css"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@inlet/react-pixi": "^0.2.0",
    "@material-ui/core": "latest",
    "@material-ui/icons": "^3.0.1",
    "babel-preset-env": "latest",
    "babel-preset-react": "latest",
    "bytebuffer": "^5.0.1",
    "jss": "latest",
    "pixi.js": "^4.8.2",
    "react": "^16.5.2",
    "react-dom": "latest",
    "react-jss": "latest",
    "styled-components": "^3.4.5",
    "websocket": "^1.0.28"
  },
  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-eslint": "^8.0.3",
    "babel-plugin-transform-class-properties": "^6.24.1",
    "babel-plugin-transform-decorators-legacy": "^1.3.5",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-stage-2": "^6.24.1",
    "copyfiles": "^2.1.0",
    "eslint": "^4.13.1",
    "node-sass": "^4.9.3",
    "parcel-bundler": "latest"
  }
}

😯 Current Behavior

When the application is building not found the module of react-pixi

💁 Possible Solution

I think that the solution is put a new way to write:

import { Stage, Sprite } from '@inlet/react-pixi'

💻 Code Sample

import { Stage, Sprite } from '@inlet/react-pixi'

🌍 Your Environment

"@inlet/react-pixi": "^0.2.0", "@material-ui/core": "latest", "pixi.js": "^4.8.2", "react": "^16.5.2", "react-dom": "latest", "parcel-bundler": "latest"

elliott-parkinson commented 5 years ago

I can't solve the bug on the end of Parcel, however I have located the issue. It's because there is a loader depending on environment with react-pixi.

The code for the initial file is: module.exports = require(./dist/react-pixi.cjs${process.env.NODE_ENV === 'development' ? '-dev' : ''})

This means it looks inside it's local node_modules and finds the right file. Of course, once bundled these do not exist. The solution for me was:

import { Stage, Sprite } from '@inlet/react-pixi/dist/react-pixi.cjs'

Instead of: import { Stage, Sprite } from '@inlet/react-pixi'

I don't think this is the responsibility of bundlers like parcel or webpack to deal with, but is more a problem with the library.

DeMoorJasper commented 5 years ago

The right approach would probably be something like this:

if (process.env.NODE_ENV === “development) {
Module.exports = require(...-dev.cjs)
} else {
Module.exports = require(....cjs)
}

I think both the non standard extension and dynamic require cause issues

_{Sent with GitHawk}

jeeeckson commented 5 years ago

Hi, i dont use more this framework, i leave the project, maybe in the future take back the project!

parcel-bundler / parcel

Problem with @inlet/react-pixi #2082