structor icon indicating copy to clipboard operation
structor copied to clipboard

webpack version conflict when following "Integration with Create React App" doc

Open jtbeckha opened this issue 7 years ago • 3 comments

When following the steps here https://github.com/ipselon/structor/blob/master/docs/integrating-with-create-react-app.md I ran into a webpack issue that appears to stem from a version conflict between the version of structor (2.3.2) and react-scripts (1.0.14) npm pulled by default.
To reproduce the issue just follow the steps in the doc e.g.

sudo npm install -g create-react-app
create-react-app structor-test
cd structor-test/
npm install structor
npm install -D cross-env
vim package.json
npm run structor

Then when you navigate to localhost:2222/structor nothing shows up in the workspace. I got this error in the server console, not sure if it's related or not

TypeError: m.forEachChunk is not a function
    at modules.forEach.m (/home/jtbeckha/workspace/learning/structor-test/node_modules/webpack/lib/optimize/OccurrenceOrderPlugin.js:26:8)
    at Array.forEach (<anonymous>)
    at Compilation.compilation.plugin (/home/jtbeckha/workspace/learning/structor-test/node_modules/webpack/lib/optimize/OccurrenceOrderPlugin.js:23:13)
    at Compilation.applyPlugins1 (/home/jtbeckha/workspace/learning/structor-test/node_modules/tapable/lib/Tapable.js:75:14)
    at sealPart2 (/home/jtbeckha/workspace/learning/structor-test/node_modules/structor/node_modules/webpack/lib/Compilation.js:589:9)
    at Compilation.applyPluginsAsyncSeries (/home/jtbeckha/workspace/learning/structor-test/node_modules/tapable/lib/Tapable.js:195:46)
    at Compilation.seal (/home/jtbeckha/workspace/learning/structor-test/node_modules/structor/node_modules/webpack/lib/Compilation.js:579:8)
    at /home/jtbeckha/workspace/learning/structor-test/node_modules/structor/node_modules/webpack/lib/Compiler.js:493:16
    at /home/jtbeckha/workspace/learning/structor-test/node_modules/tapable/lib/Tapable.js:289:11
    at _addModuleChain (/home/jtbeckha/workspace/learning/structor-test/node_modules/structor/node_modules/webpack/lib/Compilation.js:481:11)

After some investigation I discovered react-scripts is using [email protected], and structor is using [email protected]. I was able to fix my project by rolling back to react-scripts 1.0.10 which is still on webpack 2, but wanted to create this issue to find out if there is a better way to fix it (I'm still relatively new to the react/js ecosystem), and say it might be worth adding a note to that doc about this

jtbeckha avatar Oct 14 '17 19:10 jtbeckha

I have this question too.

heianqishizhisuiyuan avatar Oct 16 '17 01:10 heianqishizhisuiyuan

I also had the same problem - my specific steps to get it working were -

  1. followed all instructions down to and including "cd my-notes"
  2. did "npm list react-scripts" to check version - found it was > 1.0.10 (see jtbeckha's text above) so
  3. did "npm uninstall react-scripts" followed by
  4. npm install [email protected]

then continued working through the original instructions from "npm install structor".

fculross avatar Nov 22 '17 13:11 fculross

I also resolved with "react-scripts": "1.0.10" into package.json

@ipselon maybe can be useful changing documentation

lomby92 avatar Feb 27 '18 18:02 lomby92