react-planner icon indicating copy to clipboard operation
react-planner copied to clipboard

Installation Problems

Open GazEdBro opened this issue 4 years ago • 3 comments

Firstly we are really really keen to use react-planner because it looks like by far the best available floor planner. Whilst relatively new to react I have some years experience with Node.js, so I would expect to be able to get a library working. Installation tripped a couple of times in the catalogue, one of the mtl files referenced a png when the file was a jpg - this was changed and seems successful. And another file has import ImageFul from './imageful'; which had to be changed to import ImageFul from './imageful.jsx'; which I changed but does this mean that I am missing some part of the toolchain? The main (github) page does not mention any prerequisites in terms of libraries or loaders (I had to set up and configure babel-plugin-import-glob) what npm dependencies are not installed with react-planner? Anyway having gone through a painful process, the package finally compiled - but gives this set of errors:

react_devtools_backend.js:6 [BABEL] Note: The code generator has deoptimised the styling of "http://planner.appl/js/dist/main.js" as it exceeds the max of "500KB". r @ react_devtools_backend.js:6 i @ babel.min.js:10 t @ babel.min.js:10 t.default @ babel.min.js:10 n.generate @ babel.min.js:2 n.transform @ babel.min.js:2 (anonymous) @ babel.min.js:14 n.wrap @ babel.min.js:2 e.transform @ babel.min.js:14 s @ babel.min.js:1 r @ babel.min.js:24 i @ babel.min.js:24 r @ babel.min.js:24 e.src.n..l.content @ babel.min.js:24 n.onreadystatechange @ babel.min.js:24 XMLHttpRequest.send (async) s @ babel.min.js:24 (anonymous) @ babel.min.js:24 o @ babel.min.js:24 u @ babel.min.js:24 f @ babel.min.js:1 (anonymous) @ babel.min.js:1 main.js:1 Uncaught TypeError: e.substr is not a function at $a.load (:1:417556) at ts.load (:1:418437) at Module. (:45:1223858) at n (:1:356) at :1:1198 at :1:1210 at i (babel.min.js:24) at r (babel.min.js:24) at e.src.n..l.content (babel.min.js:24) at XMLHttpRequest.n.onreadystatechange (babel.min.js:24) load @ main.js:1 load @ main.js:1 (anonymous) @ main.js:53 n @ main.js:1 (anonymous) @ main.js:1 (anonymous) @ main.js:1 i @ babel.min.js:24 r @ babel.min.js:24 e.src.n..l.content @ babel.min.js:24 n.onreadystatechange @ babel.min.js:24 XMLHttpRequest.send (async) s @ babel.min.js:24 (anonymous) @ babel.min.js:24 o @ babel.min.js:24 u @ babel.min.js:24 f @ babel.min.js:1 (anonymous) @ babel.min.js:1 [object%20Module]:1 GET http://planner.appl/[object%20Module] 404 (Not Found)

I am at a loss now having spent at least 40 hours on this. Almost certainly missing something basic!

GazEdBro avatar Apr 22 '20 09:04 GazEdBro

Going round the houses still on this. Did a clean install using the demo webpack.conf.js - now however I play it I am getting

ERROR in ./src/renderer.jsx Module build failed (from ./node_modules/babel-loader/lib/index.js): Error: Cannot find module 'babel-preset-react' from '/home/directory' If you want to resolve "react", use "module:react" Did you mean "@babel/react"?

So am am pretty sure that there are 2 parts of the system, one is referencing @babel and just babel, but still can't find a resolution.

GazEdBro avatar Apr 27 '20 13:04 GazEdBro

I had similar issues. What made the /demo folder finally compile for me was adding the following after line ~48 on the /demo/webpack.config.js file "import-glob", I then ran npx webpack in that folder and it compiled down for me I also added npm install babel-loader babel-preset-react at some point troubleshooting, but am not sure if that had an impact or not...

wilsmex avatar May 08 '20 17:05 wilsmex

Hi - I had to use someone to help out on this. Embarrassing! (wilsmex I had tried the import-glob) fix myself but it still stuck. Anyway this bit is finished for me. But I will leave this open as a marker that this aspect can use some improvement. (OK any admin feel free to close).

GazEdBro avatar May 21 '20 10:05 GazEdBro