Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Upgrade guide from 3.x.x to 4.x.x #1531

humphreybc opened this issue May 28, 2018 · 7 comments


Copy link

commented May 28, 2018

Hi, I am trying to upgrade our project from 3.x.x to 4.x.x and I'm having a lot of difficulty. Is there a step-by-step upgrade guide I can follow somewhere? What state is the 4.x.x release in?

I've tried simply blowing away our old configuration and running bundle exec rails webpacker:install but that doesn't work. I've run into #1295 and #1500 along with Cannot find module 'webpack/schemas/WebpackOptions.json' at various times while trying to upgrade to 4.x.x.

Some more information on what's required to migrate to 4.x.x would be great.


This comment has been minimized.

Copy link

commented May 29, 2018

Thanks, @humphreybc The current 4.x release is a pre-release and there is some work still left to be done including documentation. We are working on this and hopefully should have a stable release in next 2 weeks.

But if you want to upgrade now, what happens if you follow these steps in your app:

yarn add @rails/webpacker@4.0.0-pre.2
yarn add webpack-cli

add 4.x version to gemfile and run bundle update

then run: bundle exec rails webpacker:install (please check diff before replacing existing files)


This comment has been minimized.

Copy link

commented May 30, 2018

@gauravtiwari Thanks. I don't think you want bundle update since this will update all the gems. Instead, I think you mean bundle install so I proceeded with that instead.

Here's my experience following your instructions step-by-step.

Installing pre-release version

yarn add @rails/webpacker@4.0.0-pre.2

This added "@rails/webpacker": "4.0.0-pre.2" as a dependency to package.json.

Installing webpack-cli

yarn add webpack-cli

This added "webpack-cli": "^2.1.4" as a dependency to package.json.

Updating version in Gemfile

Add gem 'webpacker', '>= 4.0.x' to Gemfile.

bundle install

Output: Using webpacker 4.0.0.pre.pre.2 (was 1.2)

Running webpacker:install

bundle exec rails webpacker:install

This resulted in a bunch of conflicts. The files were dramatically different. In a past attempt, I decided to overwrite everything (starting fresh) and didn't get anywhere, so this time, I decided not to overwrite what was there already.

Here is a gist with our existing configuration files.

It's important to note that after running this command, I checked package.json and found that it had reverted to 3.5.3. Something in the webpacker:install script is installing 3.5.3. This is probably the cause of #1500.

"@rails/webpacker": "^3.5.3"

Running ./bin/webpack-dev-server

I get the following error:

humphreybc@Benjamins-MacBook-Pro ~/C/dovetail-rails> ./bin/webpack-dev-server
    throw err;

Error: Cannot find module 'webpack/schemas/WebpackOptions.json'
    at Function.Module._resolveFilename (module.js:555:15)
    at Function.Module._load (module.js:482:25)
    at Module.require (module.js:604:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/Users/humphreybc/Code/dovetail-rails/node_modules/webpack-cli/bin/config-yargs.js:1:85)
    at Module._compile (module.js:660:30)
    at Object.Module._extensions..js (module.js:671:10)
    at Module.load (module.js:573:32)
    at tryModuleLoad (module.js:513:12)
    at Function.Module._load (module.js:505:3)

Running ./bin/webpack

humphreybc@Benjamins-MacBook-Pro ~/C/dovetail-rails> ./bin/webpack

[at-loader] Using typescript@2.8.3 from typescript and "tsconfig.json" from /Users/humphreybc/Code/dovetail-rails/tsconfig.json.

[at-loader] Checking started in a separate process...

[at-loader] Ok, 2.091 sec.
Hash: 09bf022d3139eb2d20d0
Version: webpack 3.11.0
Time: 33749ms
             Asset       Size  Chunks                    Chunk Names
    application.js    7.41 MB       0  [emitted]  [big]  application
      collector.js    1.33 MB       1  [emitted]  [big]  collector    8.42 MB       0  [emitted]         application    1.45 MB       1  [emitted]         collector
     manifest.json  274 bytes          [emitted]         
   [3] ./node_modules/typestyle-react/lib.es2015/index.js + 1 modules 5.15 kB {0} {1} [built]
   [4] ./app/javascript/dovetail/variables.tsx 3.24 kB {0} {1} [built]
   [8] ./node_modules/typestyle/lib.es2015/index.js + 3 modules 14.8 kB {0} {1} [built]
  [13] ./app/javascript/dovetail/app/routing/index.tsx 352 bytes {0} [built]
 [546] ./app/javascript/packs/application.tsx 1.18 kB {0} [built]
 [547] ./app/javascript/dovetail/app/index.tsx 10.6 kB {0} [built]
 [596] ./app/javascript/dovetail/app/pages/NewNotePage/index.tsx 3.33 kB {0} [built]
 [651] ./app/javascript/dovetail/app/pages/ProjectSettingsPage/index.tsx 5.91 kB {0} [built]
 [711] ./app/javascript/dovetail/app/routing/NoteRouteInfo.tsx 1.09 kB {0} [built]
 [714] ./app/javascript/dovetail/ui/app/Header/index.tsx 8.07 kB {0} [built]
 [727] ./app/javascript/dovetail/ui/app/Tracker/index.tsx 1.7 kB {0} [built]
 [733] ./app/javascript/dovetail/app/pages/NewProjectPage/index.tsx 2.5 kB {0} [built]
 [734] ./app/javascript/dovetail/app/pages/NotePage/index.tsx 32.8 kB {0} [built]
[1080] ./app/javascript/packs/collector.tsx 487 bytes {1} [built]
[1081] ./app/javascript/dovetail/collector/index.tsx 6.53 kB {1} [built]
    + 1068 hidden modules

This comment has been minimized.

Copy link

commented Jun 15, 2018

As @humphreybc said, do not run the install script if you're doing a delicate and complicated upgrade.

I finally got my setup working with webpack-dev-server, Vue.js, Rails and Webpacker served over nginx running on a remote dev vps. I ssh in to a vps to do dev work and getting webpacker and the webpack dev server working there was ... fun!

This gist is sort of a mess because it was never intended for sharing, but maybe it might help someone else in a similar situation:


This comment has been minimized.

Copy link

commented Sep 12, 2018

I also had some minor trouble with the upgrade process.

I did:

yarn add @rails/webpacker@4.0.0-pre.2
yarn add webpack-cli
yarn upgrade webpack-dev-server@3.1.4

Add gem 'webpacker', '>= 4.0.x' to Gemfile. Then,

bundle install

The trouble was with bundle exec rails webpacker:install. I went through looking at the diffs and said no to a few, but I missed it removing "react" from my .babelrc, so added it back. Be careful with this step in particular. For more complex setups, you may have to say no to more things, but note the changes the installer wants to make and manually adjust them.


This comment has been minimized.

Copy link

commented Sep 18, 2018

@gauravtiwari is there a roadmap to stable 4?


This comment has been minimized.

Copy link

commented Oct 1, 2018

Just made another pre-release (with babel 7 support):

yarn add @rails/webpacker@next
bundle update webpacker

I will put the milestone in an issue. Mainly, I need to go through all the issues and merge engine support PR.


This comment has been minimized.

Copy link

commented Dec 15, 2018

Please use the latest RC, and feel free to open a new issue with more details if this is still an issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
None yet
5 participants
You can’t perform that action at this time.