ShakaCode | ShakaCode Blog | Rails On Maui Blog | Rails | ReactJs | JavaScript | Webpack | Productivity |

Working out of a Webpack problem


#1

Background: I’m running React_on_rails 3.0.5. A few days ago, I did an npm update to webpack, because there was some problem I was having with “source-map” something-or-other that a Google search told me an update would solve. It did.

This morning, I was trying to run some Capybara tests. React_on_rails spit out a lengthy message about webpack not rebuilding generated files:

React on Rails is ensuring your JavaScript generated files are up to date!

Detected Webpack processes running to rebuild your generated files:
client:  23959 node /Users/Matt/Projects/SlackOps/client/node_modules/.bin/webpack -w --config webpack.client.rails.config.js

Even though we detected the webpack watch processes are running, we found files modified that are
not causing a rebuild of your generated files:

/Users/Matt/Projects/SlackOps/client/node_modules

One possibility is that you modified a file in your directory that is not a dependency of
your webpack files: /Users/Matt/Projects/SlackOps/client

To be sure, we will now rebuild your generated files.
If you are frequently running tests, you can run webpack in watch mode to speed up this process.
See the official documentation:
https://github.com/shakacode/react_on_rails/blob/master/docs/additional_reading/rspec_configuration.md

Building Webpack client-rendering assets...
Completed building Webpack client-rendering assets.

Since then, the javascript portions of the website are gone. All three ‘clientRegistration.jsx’ files are failing to load, with identical errors (except for the path names of course):

07:00:17 client.1 | ERROR in ./app/lib/startup/clientRegistration.jsx
07:00:17 client.1 | Module build failed: TypeError: Path must be a string. Received undefined
07:00:17 client.1 |     at assertPath (path.js:7:11)
07:00:17 client.1 |     at Object.dirname (path.js:1324:5)
07:00:17 client.1 |     at /Users/Matt/Projects/SlackOps/client/node_modules/babel-core/lib/transformation/file/options/option-manager.js:374:36
07:00:17 client.1 |     at /Users/Matt/Projects/SlackOps/client/node_modules/babel-core/lib/transformation/file/options/option-manager.js:396:22
07:00:17 client.1 |     at Array.map (native)
07:00:17 client.1 |     at OptionManager.resolvePresets (/Users/Matt/Projects/SlackOps/client/node_modules/babel-core/lib/transformation/file/options/option-manager.js:385:20)
07:00:17 client.1 |     at OptionManager.mergePresets (/Users/Matt/Projects/SlackOps/client/node_modules/babel-core/lib/transformation/file/options/option-manager.js:369:10)
07:00:17 client.1 |     at OptionManager.mergeOptions (/Users/Matt/Projects/SlackOps/client/node_modules/babel-core/lib/transformation/file/options/option-manager.js:328:14)
07:00:17 client.1 |     at /Users/Matt/Projects/SlackOps/client/node_modules/babel-core/lib/transformation/file/options/option-manager.js:370:14
07:00:17 client.1 |     at /Users/Matt/Projects/SlackOps/client/node_modules/babel-core/lib/transformation/file/options/option-manager.js:390:24
07:00:17 client.1 |     at Array.map (native)
07:00:17 client.1 |     at OptionManager.resolvePresets (/Users/Matt/Projects/SlackOps/client/node_modules/babel-core/lib/transformation/file/options/option-manager.js:385:20)
07:00:17 client.1 |     at OptionManager.mergePresets (/Users/Matt/Projects/SlackOps/client/node_modules/babel-core/lib/transformation/file/options/option-manager.js:369:10)
07:00:17 client.1 |     at OptionManager.mergeOptions (/Users/Matt/Projects/SlackOps/client/node_modules/babel-core/lib/transformation/file/options/option-manager.js:328:14)
07:00:17 client.1 |     at OptionManager.addConfig (/Users/Matt/Projects/SlackOps/client/node_modules/babel-core/lib/transformation/file/options/option-manager.js:234:10)
07:00:17 client.1 |     at OptionManager.findConfigs (/Users/Matt/Projects/SlackOps/client/node_modules/babel-core/lib/transformation/file/options/option-manager.js:434:16)
07:00:17 client.1 |     at OptionManager.init (/Users/Matt/Projects/SlackOps/client/node_modules/babel-core/lib/transformation/file/options/option-manager.js:482:12)
07:00:17 client.1 |     at File.initOptions (/Users/Matt/Projects/SlackOps/client/node_modules/babel-core/lib/transformation/file/index.js:211:75)
07:00:17 client.1 |     at new File (/Users/Matt/Projects/SlackOps/client/node_modules/babel-core/lib/transformation/file/index.js:129:22)
07:00:17 client.1 |     at Pipeline.transform (/Users/Matt/Projects/SlackOps/client/node_modules/babel-core/lib/transformation/pipeline.js:48:16)
07:00:17 client.1 |     at transpile (/Users/Matt/Projects/SlackOps/client/node_modules/babel-loader/index.js:14:22)
07:00:17 client.1 |     at Object.module.exports (/Users/Matt/Projects/SlackOps/client/node_modules/babel-loader/index.js:88:12)
07:00:17 client.1 |  @ multi app

None of these files have been touched in weeks, and everything has been chugging along fine, so there’s definitely no problem with the files themselves.

I have no idea what could have happened when React_on_rails tried to generate files for testing purposes that could have caused a problem. Have any of you seen anything like this?

If not, what’s a good exit strategy? Can I downgrade Webpack and just cope with all the warnings about source-map problems, in hopes that it fixes things? Upgrade the whole app to current version of React_on_rails and hope that fixes things?


#2

Huh. Not a webpack problem after all. Reverting node to an earlier version fixed it.


#3

@MatthewMDavis You’ll eventually want to update to the latest Node and Webpack!