Webpacker: Heroku and webpacker v3.0.0

[vavgustov]

Heroku can't precompile assets with webpacker v3.0.0 but v.2.0.0 worked ok. It's because .bin/webpack doesn't exist:

➜  wb_test git:(master) heroku run rake assets:precompile
Running rake assets:precompile on ⬢ guarded-fortress-96119... up, run.9848 (Free)
yarn install v0.22.0
[1/4] Resolving packages...
success Already up-to-date.
Done in 1.81s.
Webpacker is installed 🎉 🍰
Using /app/config/webpacker.yml file for setting up webpack paths
Compiling…
Compilation failed:

./bin/webpack:26:in `exec': No such file or directory - /app/node_modules/.bin/webpack (Errno::ENOENT)
    from ./bin/webpack:26:in `block in <main>'
    from ./bin/webpack:25:in `chdir'
    from ./bin/webpack:25:in `<main>'

Content of /app/node_modules/.bin/:

~/node_modules/.bin $ ls
webpack-dev-server

Seems yarn v0.22.0 doesn't install bins for nested dependencies (in this case for @rails/webpacker). So if I add webpack as dependency then it works. It seems more like heroku/yarn issue but wanted to let you know.

[renchap]

See https://github.com/rails/webpacker/pull/727

Webpacker 3.0 requires Yarn >= 0.25.2

[vavgustov]

yes on my local machine with yarn v0.27.5 it works good. Seems heroku need some time to upgrade yarn version.

[renchap]

Looks like a PR is needed in the Ruby buildpack to change it: https://github.com/heroku/heroku-buildpack-ruby/blob/78eefa66b96fd04b4738ad8ed66d9bd038324064/lib/language_pack/helpers/nodebin.rb#L21

I suggest you open an issue on this repo, the maintainers are quite responsive.

[javan]

I just opened https://github.com/rails/webpacker/pull/740, which adds a yarn requirement to package.json's "engines" section. Wonder if the buildpack could read / respect that somehow?

[gauravtiwari]

Yeah heroku respects the engines requirement - https://devcenter.heroku.com/articles/nodejs-support#specifying-a-node-js-version, will take a look at the PR now and we can merge 👍

[javan]

I don't know if that'll work for an engines requirement from a dependency. Might only be for your app's package.json .

[gauravtiwari]

BTW just deployed an app to heroku and seems to pull in correct yarn version

[WoH]

@gauravtiwari It seems like you are using multiple (node + ruby) buildpacks.
People affected might be the ones only using the ruby buildpack.

[javan]

If you need a temporary workaround, you can update your app's bin/webpack to use yarn run:

--- a/bin/webpack
+++ b/bin/webpack
@@ -20,7 +20,7 @@ unless File.exist?(WEBPACK_CONFIG)
 end

 env = { "NODE_PATH" => NODE_MODULES_PATH.shellescape }
-cmd = [ "#{NODE_MODULES_PATH}/.bin/webpack", "--config", WEBPACK_CONFIG ] + ARGV
+cmd = [ "yarn", "run", "webpack", "--config", WEBPACK_CONFIG ] + ARGV

[gauravtiwari]

@WoH Oh yes, can confirm - since it's hardcoded. I guess the easiest fix would be to use both ruby and node js buildpack together and that way you don't need to modify anything for now 👍

heroku buildpacks:add heroku/nodejs
heroku buildpacks:add heroku/ruby

[gauravtiwari]

//cc @schneems @hone

[johnrees]

@gauravtiwari heroku buildpacks:set will overwrite any previous buildpack(s) with the single buildpack you specify. I think the 'safe' way to run these commands would be -

heroku buildpacks:add heroku/nodejs
heroku buildpacks:add heroku/ruby

Note, it seems that order is important. heroku buildpacks should return heroku/nodejs BEFORE heroku/ruby

heroku buildpacks:clear will remove all buildpacks if you want to add them again in order. So if you just wanted to do all these steps in one go you could also run -

heroku buildpacks:set heroku/nodejs
heroku buildpacks:add heroku/ruby

If for some reason the above doesn't work alone I'm also including

"engines": {
  "yarn": ">= 0.25.2"
}

in my package.json which heroku/nodejs seems to honour during the deployment, although it shouldn't be necessary (I'm including other engines in there too).

[caseyprovost]

@vavgustov I believe you should be all set here now. I am using webpacker 3 with vue 2 and rails 5.1 on Heroku just swimmingly :) Feel free to reach out if you are still having issues and maybe I can help you out.

Helpful hints:

• Follow @johnrees advice above ^^, those buildpacks are important
• Upgrade brew and then Yarn
• run bin/yarn locally after upgrading
• commit any changes
• deploy to heroku

[vavgustov]

@caseyprovost thanks, yes I use solution with node buildpack and found it optimal while heroku works on ruby buildpack improvements. I guess they will add support for engines section for ruby buildpack or at least upgrade yarn.

From my side I would recommend these links for those who have troubles with node + ruby buildpacks:

• specify node/npm/yarn version: https://devcenter.heroku.com/articles/nodejs-support#specifying-a-node-js-version. By the way webpacker already added yarn version in v3.0.1: https://github.com/rails/webpacker/blob/9d29ddd14c2cbe94f4aad154a92f4a2a40b498fd/package.json#L11
• how to add node buildpack and why order is important: https://devcenter.heroku.com/articles/using-multiple-buildpacks-for-an-app#adding-a-buildpack

[kylefox]

Just wanted to add that @johnrees's solution worked for me. I ran these commands and the next deploy worked 👍

heroku buildpacks:clear
heroku buildpacks:set heroku/nodejs
heroku buildpacks:add heroku/ruby

[gauravtiwari]

@johnrees thanks 💯 👍

[schneems]

Sorry for the delay responding here.

You can also do a heroku buildpacks:add heroku/nodejs -i 1 to set nodejs first.

Upgrading the system version of Yarn to v1.0.2 would resolve the issue. Any problems doing that?

[gauravtiwari]

@schneems Thanks, that should work 👍 💯

[casiodk]

heroku buildpacks:add heroku/nodejs -i 1 is the proper command

[antwonlee]

Thank you! 👍 💯

[kofronpi]

Is it mandatory to fiddle with the heroku buildpacks or is it a temporary fix ?

[gauravtiwari]

Until this PR is merged: https://github.com/heroku/heroku-buildpack-ruby/pull/620

[schneems]

I just merged in yarn 1.0.2 into the master branch of the buildpack. If there's no regressions or issues reported then i'll deploy it shortly. In the mean time use the heroku/nodejs buildpack.

[schneems]

To wrap things up, I deployed Yarn 1.0.2 today which should fix this up https://devcenter.heroku.com/changelog-items/1270. Anyone should be able to use this version of webpacker with Heroku without making any changes to their buildpacks.

[javan]

Thank you, @schneems!

[AdamT]

Pushing to Heroku I get the compilation failure in the output.

remote: -----> Installing node-v6.11.1-linux-x64
remote: -----> Installing yarn-v1.0.2
remote: -----> Detecting rake tasks
remote: -----> Preparing app for Rails asset pipeline
remote:        Running: rake assets:precompile
remote:        Webpacker is installed 🎉 🍰
remote:        Using /tmp/build_33ca1c3c1a48a7a9ec42a1429cb5fb45/config/webpacker.yml file for setting up webpack paths
remote:        Compiling…
remote:        Compilation failed:
remote:        ./bin/webpack:26:in `exec': No such file or directory - /tmp/build_33ca1c3c1a48a7a9ec42a1429cb5fb45/node_modules/.bin/webpack (Errno::ENOENT)
remote:        from ./bin/webpack:26:in `block in <main>'
remote:        from ./bin/webpack:25:in `chdir'
remote:        from ./bin/webpack:25:in `<main>'
remote:        Asset precompilation completed (2.88s)
remote:        Cleaning assets
remote:        Running: rake assets:clean

Rails 5.1.4
Webpacker 3.0.2

This seems like the same issue.

When I add the nodejs buildpack via:

heroku buildpacks:add heroku/nodejs -i 1

then the compile works

However, when I then remove the buildpack (since explicitly using it is not needed) the compilation fails once again:

$ heroku buildpacks:remove heroku/nodejs --app my-app
 ▸    heroku-cli: This CLI is deprecated. Please reinstall from https://cli.heroku.com
Buildpack removed. Next release on my-app will use heroku/ruby.
Run git push heroku master to create a new release using this buildpack.

$ git commit -am 'remove nodejs buildpack' --allow-empty
[feature/add-elm 3a88ca8] remove nodejs buildpack

$ git push heroku_qa feature/add-elm:master -f

remote: -----> Installing node-v6.11.1-linux-x64
remote: -----> Installing yarn-v1.0.2
remote: -----> Detecting rake tasks
remote: -----> Preparing app for Rails asset pipeline
remote:        Running: rake assets:precompile
remote:        Webpacker is installed 🎉 🍰
remote:        Using /tmp/build_082da8f448da861055c243dd742dbb79/config/webpacker.yml file for setting up webpack paths
remote:        Compiling…
remote:        Compilation failed:
remote:        ./bin/webpack:26:in `exec': No such file or directory - /tmp/build_082da8f448da861055c243dd742dbb79/node_modules/.bin/webpack (Errno::ENOENT)
remote:        from ./bin/webpack:26:in `block in <main>'
remote:        from ./bin/webpack:25:in `chdir'
remote:        from ./bin/webpack:25:in `<main>'
remote:        Asset precompilation completed (2.75s)
remote:        Cleaning assets
remote:        Running: rake assets:clean

[prrrnd]

Also getting the same compilation failure as @AdamT when removing the nodejs buildpack.

[gauravtiwari]

Could be related to yarn version being used with ruby buildpack? Installing yarn-v1.0.2 What version of yarn it's using when you deploy with nodejs buildpack?

[prrrnd]

It seems to be related, yes. With the nodejs buildpack, yarn 1.3.2 gets installed vs. yarn 1.0.2 with the ruby buildpack.

[gauravtiwari]

Also, I see in the log it's not running yarn install after installing yarn so, that could be the problem too. Do you have a webpack and yarn binstub in your ./bin/* directory?

[prrrnd]

Yes, I do have those binstubs. Anyway, it seems that going for the nodejs buildpack first is the solution as per this comment.

[sambecker]

FWIW heroku buildpacks:add heroku/nodejs -i 1 didn't properly reorder buildpacks for me.

I needed to manually reorder them from the Heroku dashboard in order for my deploy to work.