Webpacker: Compiles fail with no output

Created on 17 May 2017  ·  64Comments  ·  Source: rails/webpacker

From https://github.com/heroku/heroku-buildpack-ruby/issues/562

I'm getting a non-trivial number of people getting compile failures, but with no debug output of any kind. Here's an example:

remote:        Webpacker is installed 🎉 🍰
remote:        Using /tmp/build_c3975d9e573c1bf0b4e6b532daa48fde/config/webpack/paths.yml file for setting up webpack paths
remote:        Compiling webpacker assets 🎉
remote:  !
remote:  !     Precompiling assets failed.
remote:  !
remote:  !     Push rejected, failed to compile Ruby app.
remote: 
remote:  !     Push failed
remote: Verifying deploy....
remote: 
remote: !   Push rejected to [my app].

Is there anything else we can do when this happens? Any way to add debug info? Maybe toggle an environment variable for extra logging?

Have you seen silent failures like this before? Any ideas?

picture schneems
👍11

Most helpful comment

Failed with no output:

NODE_ENV=production RAILS_ENV=production bundle exec rails assets:precompile --trace
** Invoke assets:precompile (first_time)
** Invoke assets:environment (first_time)
** Execute assets:environment
** Invoke environment (first_time)
** Execute environment
** Invoke yarn:install (first_time)
** Execute yarn:install
yarn install v1.15.2
warning package.json: No license field
warning No license field
[1/4] Resolving packages...
[2/4] Fetching packages...
info [email protected]: The platform "linux" is incompatible with this module.
info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning " > [email protected]" has unmet peer dependency "webpack@^4.0.0".
warning "webpack-dev-server > [email protected]" has unmet peer dependency "webpack@^4.0.0".
[4/4] Building fresh packages...
Done in 5.69s.
** Execute assets:precompile
** Invoke webpacker:compile (first_time)
** Invoke webpacker:verify_install (first_time)
** Invoke webpacker:check_node (first_time)
** Execute webpacker:check_node
** Invoke webpacker:check_yarn (first_time)
** Execute webpacker:check_yarn
** Invoke webpacker:check_binstubs (first_time)
** Execute webpacker:check_binstubs
** Execute webpacker:verify_install
** Invoke environment 
** Execute webpacker:compile
Compiling…
Compilation failed:
warning package.json: No license field

Hash: ef8a4c46aefd8a023d3e
Version: webpack 4.29.6
Time: 554ms
Built at: 2019-03-29 14:26:44
                                        Asset       Size  Chunks             Chunk Names
       js/application-24d579ad03023092387c.js   1.02 KiB       0  [emitted]  application
    js/application-24d579ad03023092387c.js.gz  540 bytes          [emitted]  
   js/application-24d579ad03023092387c.js.map   5.05 KiB       0  [emitted]  application
js/application-24d579ad03023092387c.js.map.gz   1.91 KiB          [emitted]  
                                manifest.json  364 bytes          [emitted]  
                             manifest.json.gz  142 bytes          [emitted]  
Entrypoint application = js/application-24d579ad03023092387c.js js/application-24d579ad03023092387c.js.map
[0] ./app/javascript/packs/application.js 514 bytes {0} [built]
picture yunixon on 29 Mar 2019
👍5

All 64 comments

Thanks for filing this, Richard.

@flybayer Which version of webpacker are you using? Master branch? Can I confirm it's rails 5.1.0 and not 5.1.1?
@fuffi Same question to you

ytbryan picture ytbryan on 17 May 2017
❤1

@schneems Yepp, I have seen it before and most probably it's related to node-sass binary either not available or corrupted - related to https://github.com/sass/node-sass/issues/1918

One more thing I noticed and mentioned in (https://github.com/rails/webpacker/issues/169#issuecomment-288296033) was that with regular ruby buildpack npm isn't available alongside yarn. I think it would be useful to have that too on heroku. 

"scripts": {
"postinstall": "npm rebuild node-sass"
}

I think this is a bug we need to fix for compile task. Currently we are using a non-standard way to get output from webpack compile task, which is unhelpful for debugging. I started adding js scripts in #264. Perhaps, I can just make a PR with only scripts so it improves the debugging workflow.

gauravtiwari picture gauravtiwari on 17 May 2017
👍2

@ytbryan I'm using Rails 5.1.1 (5.1.0 didn't work either), webpacker latest master branch, ruby buildpack v160.

flybayer picture flybayer on 18 May 2017

Now precompiling is failing every single time regardless of cache state, including the exact code I was using the other week in a brand new dokku app. * _scratches head_ *

Precompiling locally in production mode works flawlessly.

flybayer picture flybayer on 18 May 2017

Update: node-sass was my problem even though there was no logging indicating this.

Adding 

"postinstall": "npm rebuild node-sass"

to my package.json scripts has fixed all my deployment problems.

I no longer need to clear the cache before every deploy.

flybayer picture flybayer on 20 May 2017

with regular ruby buildpack npm isn't available alongside yarn. I think it would be useful to have that too on heroku.

Can you say more here? What could this buy users of webpacker on Heroku?

schneems picture schneems on 23 May 2017

@schneems at the moment if the users need to use npm for anything for ex - npm rebuild node-sass using post-install hook, the npm binary isn't available on heroku on ruby buildpack with webpacker. It is available in node-js build-pack though. Might make sense to have npm too if heroku has yarn support with webpacker?

BTW, fixed the debugging issue on master so, now compile task will provide much better debug output if assets:precompile fails because of webpacker.

screen shot 2017-05-22 at 16 43 21

screen shot 2017-05-22 at 16 44 42

Ref- #403

gauravtiwari picture gauravtiwari on 23 May 2017
🎉1

I am still getting the same error as the original author, with exactly the same stack trace, even after running the npm rebuild command and evening purging the dependencies cache. Can anyone point me in the direction of resolving this?

I am running Ruby 2.3.1 with Rails 5.1.0 and Webpacker 1.2. Thanks.

erikshestopal picture erikshestopal on 23 May 2017

@thisiserik try running assets:precompile locally to see what error you get:

NODE_ENV=production RAILS_ENV=production rails assets:precompile --trace
flybayer picture flybayer on 23 May 2017
👍2

@flybayer It's complaining that I don't have transform-object-rest-spread installed, which I do. 

Using /Users/Erik/Desktop/Code/camp-paradise/config/webpacker.yml file for setting up webpack paths
** Invoke environment 
** Execute webpacker:compile
[Webpacker] Compiling assets 🎉
[Webpacker] Compilation Failed
Hash: 95406c2c03842d72f0de
Version: webpack 2.6.0
Time: 304ms
                                 Asset       Size  Chunks             Chunk Names
         index-ea927b537cff7ebd4831.js    1.97 kB       0  [emitted]  index
   application-a25a48882bbe5d5a3285.js    1.97 kB       1  [emitted]  application
           App-c7ab4878b13d50d47b2c.js    1.97 kB       2  [emitted]  App
      index-ea927b537cff7ebd4831.js.gz  652 bytes          [emitted]  
application-a25a48882bbe5d5a3285.js.gz  652 bytes          [emitted]  
        App-c7ab4878b13d50d47b2c.js.gz  651 bytes          [emitted]  
                         manifest.json  172 bytes          [emitted]  
   [0] ./app/javascript/packs/App.js 1.47 kB {2} [built] [failed] [1 error]
   [1] ./app/javascript/packs/application.js 1.47 kB {1} [built] [failed] [1 error]
   [2] ./app/javascript/packs/index.js 1.47 kB {0} [built] [failed] [1 error]

ERROR in ./app/javascript/packs/application.js
Module build failed: ReferenceError: Unknown plugin "transform-object-rest-spread" specified in "/Users/Erik/Desktop/Code/camp-paradise/.babelrc" at 0, attempted to resolve relative to "/Users/Erik/Desktop/Code/camp-paradise"
    at /Users/Erik/Desktop/Code/camp-paradise/node_modules/babel-core/lib/transformation/file/options/option-manager.js:180:17
    at Array.map (native)
    at Function.normalisePlugins (/Users/Erik/Desktop/Code/camp-paradise/node_modules/babel-core/lib/transformation/file/options/option-manager.js:158:20)
    at OptionManager.mergeOptions (/Users/Erik/Desktop/Code/camp-paradise/node_modules/babel-core/lib/transformation/file/options/option-manager.js:234:36)
    at OptionManager.init (/Users/Erik/Desktop/Code/camp-paradise/node_modules/babel-core/lib/transformation/file/options/option-manager.js:368:12)
    at File.initOptions (/Users/Erik/Desktop/Code/camp-paradise/node_modules/babel-core/lib/transformation/file/index.js:212:65)
    at new File (/Users/Erik/Desktop/Code/camp-paradise/node_modules/babel-core/lib/transformation/file/index.js:135:24)
    at Pipeline.transform (/Users/Erik/Desktop/Code/camp-paradise/node_modules/babel-core/lib/transformation/pipeline.js:46:16)
    at transpile (/Users/Erik/Desktop/Code/camp-paradise/node_modules/babel-loader/lib/index.js:48:20)
    at Object.module.exports (/Users/Erik/Desktop/Code/camp-paradise/node_modules/babel-loader/lib/index.js:163:20)
erikshestopal picture erikshestopal on 23 May 2017

@thisiserik do you have babel-plugin-transform-object-rest-spread installed as a dev dependency? It must be a normal dependency

flybayer picture flybayer on 23 May 2017

@flybayer

It must be a normal dependency

As opposed to what?

erikshestopal picture erikshestopal on 23 May 2017

As opposed to a dev dependency.

So you need in your package.json this:

  "dependencies": {
    "babel-plugin-transform-object-rest-spread": "^6.23.0",
    "..."
  },
  "devDependencies": {
    "..."
  },

instead of this:

  "dependencies": {
    "..."
  },
  "devDependencies": {
    "babel-plugin-transform-object-rest-spread": "^6.23.0",
    "..."
  },
flybayer picture flybayer on 23 May 2017

@flybayer That solved one problem, but Uglify is throwing more errors. These are not syntax errors, as I have checked. 

[Webpacker] Compiling assets 🎉
[Webpacker] Compilation Failed
Hash: b8a8965c924a031847e8
Version: webpack 2.6.0
Time: 11271ms
                                 Asset       Size  Chunks                    Chunk Names
application-f1044aff7d41a0cfc0af.js.gz  323 bytes          [emitted]         
           App-4d5a66eef65594d6529f.js    2.35 MB    0, 1  [emitted]  [big]  App
   application-f1044aff7d41a0cfc0af.js  552 bytes       2  [emitted]         application
          App-b8a8965c924a031847e8.css  273 bytes    0, 1  [emitted]         App
        index-b8a8965c924a031847e8.css  273 bytes    1, 0  [emitted]         index
         index-70f1b68da2f4a44fba00.js    2.35 MB    1, 0  [emitted]  [big]  index
       App-b8a8965c924a031847e8.css.gz  160 bytes          [emitted]         
     index-b8a8965c924a031847e8.css.gz  160 bytes          [emitted]         
        App-4d5a66eef65594d6529f.js.gz     473 kB          [emitted]  [big]  
      index-70f1b68da2f4a44fba00.js.gz     473 kB          [emitted]  [big]  
                         manifest.json  280 bytes          [emitted]         
   [0] ./~/moment/moment.js 129 kB {0} {1} [built]
   [1] ./~/react/react.js 56 bytes {0} {1} [built]
   [7] ./~/react-redux/es/index.js 194 bytes {0} {1} [built]
  [10] ./~/react-router-redux/es/index.js 356 bytes {0} {1} [built]
  [15] ./~/redux-persist/es/index.js 978 bytes {0} {1} [built]
  [18] ./app/javascript/packs/index.js 1.21 kB {0} {1} [built]
  [19] ./~/react-router-dom/es/index.js 925 bytes {0} {1} [built]
  [39] ./~/react-dom/index.js 59 bytes {0} {1} [built]
  [64] ./~/redux/es/index.js 1.08 kB {0} {1} [built]
  [98] ./~/history/createBrowserHistory.js 9.53 kB {0} {1} [built]
 [301] ./app/javascript/packs/App.js 3.28 kB {0} {1} [built]
 [316] ./app/javascript/packs/reducers/rootReducer.js 394 bytes {0} {1} [built]
 [317] ./~/redux-logger/lib/index.js 5.4 kB {0} {1} [built]
 [318] ./~/redux-thunk/lib/index.js 529 bytes {0} {1} [built]
 [545] ./app/javascript/packs/application.js 515 bytes {2} [built]
    + 536 hidden modules

ERROR in App-4d5a66eef65594d6529f.js from UglifyJs
Unexpected character '`' [App-4d5a66eef65594d6529f.js:52560,39]

ERROR in index-70f1b68da2f4a44fba00.js from UglifyJs
Unexpected character '`' [index-70f1b68da2f4a44fba00.js:52560,39]
Child extract-text-webpack-plugin:
       [0] ./~/css-loader/lib/css-base.js 2.26 kB {0} [built]
       [1] ./~/css-loader!./~/postcss-loader/lib!./~/sass-loader/lib/loader.js!./app/javascript/packs/styles/camps/RoomTypeCard.scss 417 bytes {0} [built]
Child extract-text-webpack-plugin:
       [0] ./~/css-loader/lib/css-base.js 2.26 kB {0} [built]
erikshestopal picture erikshestopal on 23 May 2017

I guess you are not using latest .babelrc

{
  "presets": [
    ["env", {
      "modules": false,
      "targets": {
        "browsers": "> 1%",
        "uglify": true
      },
      "useBuiltIns": true
    }]
  ]
}
gauravtiwari picture gauravtiwari on 23 May 2017

@gauravtiwari This is my .babelrc file and the trace is the same. 

{
  "presets": [
    ["env", {
      "modules": false,
      "targets": {
        "node": "current",
        "browsers": "> 1%",
        "uglify": true
      },
      "useBuiltIns": true
    }], "react",

  ],
  "plugins": [
    "transform-object-rest-spread"
  ]
}
erikshestopal picture erikshestopal on 23 May 2017

@thisiserik can you post your entire package.json?

flybayer picture flybayer on 23 May 2017

@flybayer Sure! Here you go... 

{
  "dependencies": {
    "animated-scroll-to": "^1.0.1",
    "autoprefixer": "^7.1.1",
    "axios": "^0.16.1",
    "babel-core": "^6.24.1",
    "babel-loader": "7.x",
    "babel-plugin-transform-object-rest-spread": "^6.23.0",
    "babel-polyfill": "^6.23.0",
    "babel-preset-env": "^1.5.1",
    "babel-preset-react": "^6.23.0",
    "bootstrap": "^4.0.0-alpha.6",
    "classnames": "^2.2.5",
    "coffee-loader": "^0.7.3",
    "coffee-script": "^1.12.6",
    "compression-webpack-plugin": "^0.4.0",
    "css-loader": "^0.28.2",
    "extract-text-webpack-plugin": "^2.1.0",
    "file-loader": "^0.11.1",
    "font-awesome": "^4.7.0",
    "glob": "^7.1.2",
    "halogen": "^0.2.0",
    "js-yaml": "^3.8.4",
    "moment": "^2.18.1",
    "node-sass": "^4.5.3",
    "npm": "^4.6.1",
    "octicons": "^5.0.1",
    "parse-link-header": "^1.0.0",
    "path-complete-extname": "^0.1.0",
    "postcss-loader": "^2.0.5",
    "postcss-smart-import": "^0.7.2",
    "precss": "^1.4.0",
    "prop-types": "^15.5.8",
    "rails-erb-loader": "^5.0.1",
    "react": "^15.4.2",
    "react-addons-css-transition-group": "^15.4.2",
    "react-addons-shallow-compare": "^15.5.1",
    "react-addons-transition-group": "^15.4.2",
    "react-dates": "^10.0.0",
    "react-dom": "^15.4.2",
    "react-octicon": "^2.0.0",
    "react-octicons-svg": "^1.1.13",
    "react-redux": "^5.0.4",
    "react-router-dom": "^4.0.0",
    "react-router-redux": "^5.0.0-alpha.6",
    "react-stripe-checkout": "^2.2.5",
    "reactstrap": "^4.4.0",
    "redux": "^3.6.0",
    "redux-logger": "^3.0.1",
    "redux-persist": "^4.0.0-beta1.2",
    "redux-thunk": "^2.2.0",
    "resolve-url-loader": "^2.0.2",
    "sass-loader": "^6.0.5",
    "style-loader": "^0.18.1",
    "webpack": "^2.6.0",
    "webpack-manifest-plugin": "^1.1.0",
    "webpack-merge": "^4.1.0"
  },
  "devDependencies": {
    "webpack-dev-server": "^2.4.5"
  }
}
erikshestopal picture erikshestopal on 23 May 2017

Not sure if node and browser option works together well? May be remove the node option and re-run again :)

gauravtiwari picture gauravtiwari on 23 May 2017

Closing in favour of #403, which addresses this issue 👍

gauravtiwari picture gauravtiwari on 24 May 2017

I'm still getting this error, Rails 5.1 and webpacker 2.0. It's definitely something to do with UglifyJs. If I comment out this section of production.js, "compiling webpacker assets" succeeds on Heroku:

const webpack = require('webpack')
const merge = require('webpack-merge')
const CompressionPlugin = require('compression-webpack-plugin')
const sharedConfig = require('./shared.js')

module.exports = merge(sharedConfig, {
  output: { filename: '[name]-[chunkhash].js' },
  devtool: 'source-map',
  stats: 'normal',

  plugins: [
    // new webpack.optimize.UglifyJsPlugin({
    //   minimize: true,
    //   sourceMap: true,

    //   compress: {
    //     warnings: false
    //   },

    //   output: {
    //     comments: false
    //   }
    // }),

    new CompressionPlugin({
      asset: '[path].gz[query]',
      algorithm: 'gzip',
      test: /\.(js|css|html|json|ico|svg|eot|otf|ttf)$/
    })
  ]
})
cgs picture cgs on 24 May 2017

@cgs Are you using latest .babelrc and could you please paste the log?

gauravtiwari picture gauravtiwari on 24 May 2017

@gauravtiwari

.babelrc:

{
  "presets": [
    ["env", {
      "modules": false,
      "targets": {
        "browsers": "> 1%",
        "uglify": true
      },
      "useBuiltIns": true
    }]
  ],

  "plugins": [
    "syntax-dynamic-import",
    ["transform-class-properties", { "spec": true }]
  ]
}

From stack trace:

ERROR in guided_search/guided_search-7c6b026ae1cfdc904357.js from UglifyJs
Unexpected token: name (defaults) [./~/vue-scrollto/src/scrollTo.js:14,0][guided_search/guided_search-7c6b026ae1cfdc904357.js:38449,4]

Looks like UglifyJs is not understanding new syntax. Not sure what the fix would be for this

cgs picture cgs on 24 May 2017

Are you using typescript - just to confirm?

gauravtiwari picture gauravtiwari on 24 May 2017

Nope just ES2015. It's choking on this file: https://github.com/rigor789/vue-scrollto/blob/master/src/scrollTo.js

cgs picture cgs on 24 May 2017

Ahh I see. May be this is related to vue-scrollto

Please could you addvue-scrollto to include array in babel-loader please?

{
  test: /\.vue$/,
// .. rest of the config
  include: ['vue-scrollto']
}

Looks like vue-scrollto is using ES6 and since babel-loader is excluding node_modules it just skips it.

gauravtiwari picture gauravtiwari on 24 May 2017

👍 That fixed it. What about vue-scrollto was causing this issue?

Oops, sorry, premature reply. I forgot to uncomment the uglifyjs bit. Still failing with the same error.

cgs picture cgs on 24 May 2017

Here's some of my own code it's also failling on:

new Vue({
  el: '#filtered-search',
  data: {
    resultCount: 0
  },
  created() {    
    // from SearchFilter
    this.$bus.$on('count', (c) => {
      this.resultCount = c
    })
  },
  components: {
    SearchFilter,
    SearchResults
  }
})

Specifically, the created() bit which is ES2015...

cgs picture cgs on 24 May 2017

@cgs How does your vue.js loader looks? For some reason it's not compiling es6 code since you got an arrow function there. Lets debug this together please.

gauravtiwari picture gauravtiwari on 25 May 2017

Sure thing. Here's my vue loader:

module.exports = {
  test: /.vue$/,
  loader: 'vue-loader',
  options: {
    loaders: {
      scss: 'vue-style-loader!css-loader!sass-loader',
      sass: 'vue-style-loader!css-loader!sass-loader?indentedSyntax'
    }
  }
}
cgs picture cgs on 25 May 2017

@cgs Ahh that's why. Please use the updated one: 

module.exports = {
  test: /.vue$/,
  loader: 'vue-loader',
  options: {
    extractCSS: true,
    loaders: {
      js: 'babel-loader',
      file: 'file-loader',
      scss: 'vue-style-loader!css-loader!postcss-loader!sass-loader',
      sass: 'vue-style-loader!css-loader!postcss-loader!sass-loader?indentedSyntax'
    }
  }
}
gauravtiwari picture gauravtiwari on 25 May 2017

or run bundle exec rails webpacker:install:vue

gauravtiwari picture gauravtiwari on 25 May 2017

Hmm, still no dice. I seem to be getting less errors now, just the one related to vue-scrollto:

ERROR in guided_search/guided_search-86ef66c69a817e0cb25c.js from UglifyJs
Unexpected token: name (defaults) [./~/vue-scrollto/src/scrollTo.js:14,0][guided_search/guided_search-86ef66c69a817e0cb25c.js:38593,4]

I tried adding vue-loader to the babel js loader again, but then I get the above error as well as two other errors pointing to my code.

cgs picture cgs on 25 May 2017

Did you include the vue-scrollto to whitelist?

gauravtiwari picture gauravtiwari on 25 May 2017

Where do I do that?

cgs picture cgs on 25 May 2017

Within the vue.js loader:

{
  test: /\.vue$/,
// .. rest of the config
  include: ['vue-scrollto']
}
gauravtiwari picture gauravtiwari on 25 May 2017

with the include, all my .vue files fail:

ERROR in ./app/javascript/packs/filtered_search/search_filter.vue
Module parse failed: /myapp/app/javascript/packs/filtered_search/search_filter.vue Unexpected token (1:0)
You may need an appropriate loader to handle this file type.
| <template>
|   <div class="search-filter">
|     <label>

(one for each .vue file)

cgs picture cgs on 25 May 2017

@cgs If you are okay I am happy to take a look at the repo with you.

For quick fix though, you can do following -

  1. Add 
yarn add babel-preset-babili

  1. Remove or comment Uglify plugin from production.js

  2. In your .babelrc - add babili to presets array and then try re-compiling

gauravtiwari picture gauravtiwari on 25 May 2017

@gauravtiwari Sorry I'm not able to share the code, but I got it working with a different workaround. I changed the way I was including vue-scrollto from my code. Specifically this is from an entry point file:

How I was including it from my code:

import VueScrollTo from 'vue-scrollto/src'

Now:

import VueScrollTo from 'vue-scrollto/vue-scrollto'

So I'm basically just including the dist / ES5 version. Not sure if the first way I was including it was incorrect. Thanks for helping me with this.

cgs picture cgs on 25 May 2017

No worries!

Nice! Yepp that's another to solve this, totally forgot 👍 Basically the problem is vue-scrollTo has es6 code, which isn't being compiled by babel-loader since node_modules are ignored. Will add this to README 👍 until we start using es6-aware minifier.

gauravtiwari picture gauravtiwari on 25 May 2017
👍1

@gauravtiwari I removed the node option and the error still persists...

** Invoke assets:precompile (first_time)
** Invoke assets:environment (first_time)
** Execute assets:environment
** Invoke environment (first_time)
** Execute environment
** Invoke yarn:install (first_time)
** Execute yarn:install
yarn install v0.22.0
warning No license field
[1/4] 🔍  Resolving packages...
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
[4/4] 📃  Building fresh packages...
✨  Done in 4.76s.
** Execute assets:precompile
** Invoke webpacker:compile (first_time)
** Invoke webpacker:verify_install (first_time)
** Invoke webpacker:check_node (first_time)
** Execute webpacker:check_node
** Invoke webpacker:check_yarn (first_time)
** Execute webpacker:check_yarn
** Invoke webpacker:check_webpack_binstubs (first_time)
** Execute webpacker:check_webpack_binstubs
** Execute webpacker:verify_install
Webpacker is installed 🎉 🍰
Using /Users/Erik/Desktop/Code/test/config/webpacker.yml file for setting up webpack paths
** Invoke environment 
** Execute webpacker:compile
[Webpacker] Compiling assets 🎉
[Webpacker] Compilation Failed
Hash: bb530fe9b256af61d40b
Version: webpack 2.6.0
Time: 11853ms
                                 Asset       Size  Chunks                    Chunk Names
application-f1044aff7d41a0cfc0af.js.gz  323 bytes          [emitted]         
           App-da1e7f9d53a7a2c5797a.js    2.35 MB    0, 1  [emitted]  [big]  App
   application-f1044aff7d41a0cfc0af.js  552 bytes       2  [emitted]         application
          App-bb530fe9b256af61d40b.css  266 bytes    0, 1  [emitted]         App
        index-bb530fe9b256af61d40b.css  266 bytes    1, 0  [emitted]         index
         index-c88aba159e3987f50abe.js    2.35 MB    1, 0  [emitted]  [big]  index
       App-bb530fe9b256af61d40b.css.gz  156 bytes          [emitted]         
     index-bb530fe9b256af61d40b.css.gz  156 bytes          [emitted]         
        App-da1e7f9d53a7a2c5797a.js.gz     472 kB          [emitted]  [big]  
      index-c88aba159e3987f50abe.js.gz     472 kB          [emitted]  [big]  
                         manifest.json  280 bytes          [emitted]         
   [0] ./~/moment/moment.js 129 kB {0} {1} [built]
   [1] ./~/react/react.js 56 bytes {0} {1} [built]
   [7] ./~/react-redux/es/index.js 194 bytes {0} {1} [built]
  [10] ./~/react-router-redux/es/index.js 356 bytes {0} {1} [built]
  [15] ./~/redux-persist/es/index.js 978 bytes {0} {1} [built]
  [18] ./app/javascript/packs/index.js 1.21 kB {0} {1} [built]
  [19] ./~/react-router-dom/es/index.js 925 bytes {0} {1} [built]
  [39] ./~/react-dom/index.js 59 bytes {0} {1} [built]
  [64] ./~/redux/es/index.js 1.08 kB {0} {1} [built]
  [98] ./~/history/createBrowserHistory.js 9.53 kB {0} {1} [built]
 [301] ./app/javascript/packs/App.js 2.6 kB {0} {1} [built]
 [316] ./app/javascript/packs/reducers/rootReducer.js 394 bytes {0} {1} [built]
 [317] ./~/redux-logger/lib/index.js 5.4 kB {0} {1} [built]
 [318] ./~/redux-thunk/lib/index.js 529 bytes {0} {1} [built]
 [545] ./app/javascript/packs/application.js 515 bytes {2} [built]
    + 536 hidden modules

ERROR in App-da1e7f9d53a7a2c5797a.js from UglifyJs
Unexpected character '`' [App-da1e7f9d53a7a2c5797a.js:52539,39]

ERROR in index-c88aba159e3987f50abe.js from UglifyJs
Unexpected character '`' [index-c88aba159e3987f50abe.js:52539,39]
Child extract-text-webpack-plugin:
       [0] ./~/css-loader/lib/css-base.js 2.26 kB {0} [built]
       [1] ./~/css-loader!./~/postcss-loader/lib!./~/sass-loader/lib/loader.js!./app/javascript/packs/styles/camps/Camps.scss 219 bytes {0} [built]
Child extract-text-webpack-plugin:
       [0] ./~/css-loader/lib/css-base.js 2.26 kB {0} [built]
       [1] ./~/css-loader!./~/postcss-loader/lib!./~/sass-loader/lib/loader.js!./app/javascript/packs/styles/camps/RoomTypeCard.scss 413 bytes {0} [built]
erikshestopal picture erikshestopal on 30 May 2017

@thisiserik Ahh, then I would suggest to give babili a shot. - yarn add babel-preset-babili and remove uglify altogether.

gauravtiwari picture gauravtiwari on 30 May 2017

@gauravtiwari Would I remove uglify: true from .babelrc, correct?

erikshestopal picture erikshestopal on 30 May 2017

@gauravtiwari As such? 

{
  "presets": [
    ["env", {
      "modules": false,
      "targets": {
        "browsers": "> 1%",
      },
      "useBuiltIns": true
    }],
    "react",

  ],
  "plugins": [
    "transform-object-rest-spread"
  ]
}
erikshestopal picture erikshestopal on 30 May 2017

Yes please - everything related to uglify must go

gauravtiwari picture gauravtiwari on 30 May 2017

If you are feeling fancy you can give prepack a try with babili using - https://github.com/gajus/prepack-webpack-plugin

  // production.js
  devtool: 'source-map',

  plugins: [
    new PrepackWebpackPlugin({ sourceMaps: true }),
    new BabiliPlugin(),
    new CompressionPlugin({
      asset: '[path].gz[query]',
      algorithm: 'gzip',
      test: /\.(js|css|html|json|ico|svg|eot|otf|ttf)$/
    })
  ]

Note: Sourcemap is optional you can remove devtool and sourcemap from prepack option - much smaller bundle size.

gauravtiwari picture gauravtiwari on 30 May 2017

@gauravtiwari That did the trick! Thanks.

Here is the contents of the my files that got the deploy to work after running npm install --save babili 

/* .babelrc */ 

{
  "presets": [
    ["env", {
      "modules": false,
      "targets": {
        "uglify": true, /* remove */ 
        "browsers": "> 1%",
      },
      "useBuiltIns": true
    }],
    "react",

  ],
  "plugins": [
    "transform-object-rest-spread",
    "babili"
  ]
}

```js
/* production.js */

/* eslint global-require: 0 */
// Note: You must run bin/webpack for changes to take effect

const webpack = require('webpack')
const merge = require('webpack-merge')
const CompressionPlugin = require('compression-webpack-plugin')
const sharedConfig = require('./shared.js')

module.exports = merge(sharedConfig, {
output: { filename: '[name]-[chunkhash].js' },

plugins: [
// new webpack.optimize.UglifyJsPlugin(),
new CompressionPlugin({
asset: '[path].gz[query]',
algorithm: 'gzip',
test: /.(js|css|svg|eot|ttf|woff|woff2)$/
})
]
})

```js
/* package.json */

{
  "dependencies": {
    "animated-scroll-to": "^1.0.1",
    "autoprefixer": "^7.1.1",
    "axios": "^0.16.1",
    "babel-core": "^6.24.1",
    "babel-loader": "7.x",
    "babel-plugin-transform-object-rest-spread": "^6.23.0",
    "babel-polyfill": "^6.23.0",
    "babel-preset-babili": "^0.1.2",
    "babel-preset-env": "^1.5.1",
    "babel-preset-react": "^6.23.0",
    "babili": "^0.1.2",
    "bootstrap": "^4.0.0-alpha.6",
    "classnames": "^2.2.5",
    "coffee-loader": "^0.7.3",
    "coffee-script": "^1.12.6",
    "compression-webpack-plugin": "^0.4.0",
    "css-loader": "^0.28.2",
    "extract-text-webpack-plugin": "^2.1.0",
    "file-loader": "^0.11.1",
    "font-awesome": "^4.7.0",
    "glob": "^7.1.2",
    "halogen": "^0.2.0",
    "js-yaml": "^3.8.4",
    "moment": "^2.18.1",
    "node-sass": "^4.5.3",
    "npm": "^4.6.1",
    "octicons": "^5.0.1",
    "parse-link-header": "^1.0.0",
    "path-complete-extname": "^0.1.0",
    "postcss-loader": "^2.0.5",
    "postcss-smart-import": "^0.7.2",
    "precss": "^1.4.0",
    "prop-types": "^15.5.8",
    "rails-erb-loader": "^5.0.1",
    "react": "^15.4.2",
    "react-addons-css-transition-group": "^15.4.2",
    "react-addons-shallow-compare": "^15.5.1",
    "react-addons-transition-group": "^15.4.2",
    "react-dates": "^10.0.0",
    "react-dom": "^15.4.2",
    "react-octicon": "^2.0.0",
    "react-octicons-svg": "^1.1.13",
    "react-redux": "^5.0.4",
    "react-router-dom": "^4.0.0",
    "react-router-redux": "^5.0.0-alpha.6",
    "react-stripe-checkout": "^2.2.5",
    "reactstrap": "^4.4.0",
    "redux": "^3.6.0",
    "redux-logger": "^3.0.1",
    "redux-persist": "^4.0.0-beta1.2",
    "redux-thunk": "^2.2.0",
    "resolve-url-loader": "^2.0.2",
    "sass-loader": "^6.0.5",
    "style-loader": "^0.18.1",
    "uglify-js": "^3.0.13",
    "webpack": "^2.6.0",
    "webpack-manifest-plugin": "^1.1.0",
    "webpack-merge": "^4.1.0"
  },
  "devDependencies": {
    "webpack-dev-server": "^2.4.5"
  }
}
erikshestopal picture erikshestopal on 30 May 2017

@thisiserik babili should be under presets and not plugins 👍

gauravtiwari picture gauravtiwari on 30 May 2017

Hi there,

I am also having an issue, with deploying using capistrano

 DEBUG [3cbcc299]   Webpacker is installed 🎉 🍰

 DEBUG [3cbcc299]

 DEBUG [3cbcc299]   Using /home/deploy/apps/habitat/releases/20170602161234/config/webpacker.yml file for setting up webpack paths

 DEBUG [3cbcc299]

 DEBUG [3cbcc299]   [Webpacker] Compiling assets 🎉

 DEBUG [3cbcc299]

 DEBUG [3cbcc299]   [Webpacker] Compilation Failed

yarn run v0.24.5

$ "/home/deploy/apps/habitat/releases/20170602161234/node_modules/.bin/webpack" --config /home/deploy/apps/habitat/releases/20170602161234/config/webpack/production.js

info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Killed

error Command failed with exit code 137.

This is my .babelrc

{
  "presets": [
    [
      "env",
      {
        "modules": false,
        "targets": {
          "browsers": "> 1%",
          "uglify": true
        },
        "useBuiltIns": true
      }
    ],
    "react"
  ],
  "plugins": [
    "syntax-dynamic-import",
    [
      "transform-class-properties",
      {
        "spec": true
      }
    ]
  ]
}

and package.json

{
  "name": "habitat",
  "private": true,
  "dependencies": {
    "babel-core": "^6.24.1",
    "babel-loader": "7.x",
    "babel-plugin-syntax-dynamic-import": "^6.18.0",
    "babel-plugin-transform-class-properties": "^6.24.1",
    "babel-polyfill": "^6.23.0",
    "babel-preset-env": "^1.5.1",
    "babel-preset-react": "^6.24.1",
    "bootstrap": "^3.3.7",
    "coffee-loader": "^0.7.3",
    "coffee-script": "^1.12.6",
    "compression-webpack-plugin": "^0.4.0",
    "css-loader": "^0.28.4",
    "extract-text-webpack-plugin": "^2.1.0",
    "file-loader": "^0.11.1",
    "font-awesome": "^4.7.0",
    "glob": "^7.1.2",
    "jquery": "^3.2.1",
    "js-yaml": "^3.8.4",
    "masonry-layout": "^4.2.0",
    "node-sass": "^4.5.3",
    "path-complete-extname": "^0.1.0",
    "postcss-cssnext": "^2.11.0",
    "postcss-loader": "^2.0.5",
    "postcss-smart-import": "^0.7.4",
    "prop-types": "^15.5.10",
    "query-string": "^4.3.4",
    "rails-erb-loader": "^5.0.1",
    "react": "^15.5.4",
    "react-dom": "^15.5.4",
    "react-google-maps": "^6.3.0",
    "react-select": "^1.0.0-rc.5",
    "react-slick": "^0.14.11",
    "resolve-url-loader": "^2.0.2",
    "sass-loader": "^6.0.5",
    "slick-carousel": "^1.6.0",
    "style-loader": "^0.18.1",
    "webpack": "^2.6.1",
    "webpack-manifest-plugin": "^1.1.0",
    "webpack-merge": "^4.1.0",
    "whatwg-fetch": "^2.0.3"
  },
  "devDependencies": {
    "webpack-dev-server": "^2.4.5"
  },
  "postinstall": "npm rebuild node-sass"
}

Rails 5.1.1 and Node 6.9.1

Any hint where to look up for the issue?

bajalovic picture bajalovic on 2 Jun 2017

Which webpacker version are you using?

gauravtiwari picture gauravtiwari on 2 Jun 2017

From Gemfile

gem 'webpacker', github: "rails/webpacker"

And from Gemfile.lock

  remote: https://github.com/rails/webpacker.git
  revision: a4297678fba34791f5618ebbff9d00cfcb92547e
  specs:
    webpacker (2.0)
      activesupport (>= 4.2)
      multi_json (~> 1.2)
      railties (>= 4.2)
bajalovic picture bajalovic on 2 Jun 2017

And there is nothing in the log why it failed? Any error message? Anything after yarn run v0.24.5?

gauravtiwari picture gauravtiwari on 2 Jun 2017

Nope, just that..

bajalovic picture bajalovic on 2 Jun 2017

Executing webpack on my machine went fine..
Am I missing some depedency on the server?

I installed node 6.10.3, yarn 0.24.5,... its Ubuntu 16.04

bajalovic picture bajalovic on 2 Jun 2017 
  "scripts": {
    "postinstall": "npm rebuild node-sass"
  }

Could you add this to your package.json and try deploying again?

Strange that you don't get any error output.

gauravtiwari picture gauravtiwari on 2 Jun 2017
👍2

Hey @gauravtiwari , now I'm getting following error

      01 Webpacker is installed 🎉 🍰
      01
      01 Using /home/deploy/apps/habitat/releases/20170602181402/config/webpacker.yml file for setting up webpack paths
      01
      01 [Webpacker] Compiling assets 🎉
      01
      01 [Webpacker] Compilation Failed
      01
      01 yarn run v0.24.5
      01 $ "/home/deploy/apps/habitat/releases/20170602181402/node_modules/.bin/webpack" --config /home/deploy/apps/habitat/releases/20170602181402/config/webpack/production.js
      01 info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
      01
      01 Killed
      01 error Command failed with exit code 137.
      01
(Backtrace restricted to imported tasks)
cap aborted!
SSHKit::Runner::ExecuteError: Exception while executing on host 104.236.10.248: rake exit status: 1
rake stdout: RVM used your Gemfile for selecting Ruby, it is all fine - Heroku does that too,
you can ignore these warnings with 'rvm rvmrc warning ignore /home/deploy/apps/habitat/releases/20170602181402/Gemfile'.
To ignore the warning for all files run 'rvm rvmrc warning ignore allGemfiles'.

yarn install v0.24.5
[1/4] Resolving packages...
success Already up-to-date.
$ npm rebuild node-sass

> [email protected] install /home/deploy/apps/habitat/releases/20170602181402/node_modules/node-sass
> node scripts/install.js

node-sass build Binary found at /home/deploy/apps/habitat/releases/20170602181402/node_modules/node-sass/vendor/linux-x64-48/binding.node

> [email protected] postinstall /home/deploy/apps/habitat/releases/20170602181402/node_modules/node-sass
> node scripts/build.js

Binary found at /home/deploy/apps/habitat/releases/20170602181402/node_modules/node-sass/vendor/linux-x64-48/binding.node
Testing binary
Binary is fine
[email protected] /home/deploy/apps/habitat/releases/20170602181402/node_modules/node-sass
Done in 7.01s.
Webpacker is installed 🎉 🍰
Using /home/deploy/apps/habitat/releases/20170602181402/config/webpacker.yml file for setting up webpack paths
[Webpacker] Compiling assets 🎉
[Webpacker] Compilation Failed
yarn run v0.24.5
$ "/home/deploy/apps/habitat/releases/20170602181402/node_modules/.bin/webpack" --config /home/deploy/apps/habitat/releases/20170602181402/config/webpack/production.js
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Killed
error Command failed with exit code 137.

rake stderr: Nothing written

SSHKit::Command::Failed: rake exit status: 1
rake stdout: RVM used your Gemfile for selecting Ruby, it is all fine - Heroku does that too,
you can ignore these warnings with 'rvm rvmrc warning ignore /home/deploy/apps/habitat/releases/20170602181402/Gemfile'.
To ignore the warning for all files run 'rvm rvmrc warning ignore allGemfiles'.

yarn install v0.24.5
[1/4] Resolving packages...
success Already up-to-date.
$ npm rebuild node-sass

> [email protected] install /home/deploy/apps/habitat/releases/20170602181402/node_modules/node-sass
> node scripts/install.js

node-sass build Binary found at /home/deploy/apps/habitat/releases/20170602181402/node_modules/node-sass/vendor/linux-x64-48/binding.node

> [email protected] postinstall /home/deploy/apps/habitat/releases/20170602181402/node_modules/node-sass
> node scripts/build.js

Binary found at /home/deploy/apps/habitat/releases/20170602181402/node_modules/node-sass/vendor/linux-x64-48/binding.node
Testing binary
Binary is fine
[email protected] /home/deploy/apps/habitat/releases/20170602181402/node_modules/node-sass
Done in 7.01s.
Webpacker is installed 🎉 🍰
Using /home/deploy/apps/habitat/releases/20170602181402/config/webpacker.yml file for setting up webpack paths
[Webpacker] Compiling assets 🎉
[Webpacker] Compilation Failed
yarn run v0.24.5
$ "/home/deploy/apps/habitat/releases/20170602181402/node_modules/.bin/webpack" --config /home/deploy/apps/habitat/releases/20170602181402/config/webpack/production.js
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Killed
error Command failed with exit code 137.

rake stderr: Nothing written

Tasks: TOP => deploy:assets:precompile
(See full trace by running task with --trace)
The deploy has failed with an error: Exception while executing on host 104.236.10.248: rake exit status: 1
rake stdout: RVM used your Gemfile for selecting Ruby, it is all fine - Heroku does that too,
you can ignore these warnings with 'rvm rvmrc warning ignore /home/deploy/apps/habitat/releases/20170602181402/Gemfile'.
To ignore the warning for all files run 'rvm rvmrc warning ignore allGemfiles'.

yarn install v0.24.5
[1/4] Resolving packages...
success Already up-to-date.
$ npm rebuild node-sass

> [email protected] install /home/deploy/apps/habitat/releases/20170602181402/node_modules/node-sass
> node scripts/install.js

node-sass build Binary found at /home/deploy/apps/habitat/releases/20170602181402/node_modules/node-sass/vendor/linux-x64-48/binding.node

> [email protected] postinstall /home/deploy/apps/habitat/releases/20170602181402/node_modules/node-sass
> node scripts/build.js

Binary found at /home/deploy/apps/habitat/releases/20170602181402/node_modules/node-sass/vendor/linux-x64-48/binding.node
Testing binary
Binary is fine
[email protected] /home/deploy/apps/habitat/releases/20170602181402/node_modules/node-sass
Done in 7.01s.
Webpacker is installed 🎉 🍰
Using /home/deploy/apps/habitat/releases/20170602181402/config/webpacker.yml file for setting up webpack paths
[Webpacker] Compiling assets 🎉
[Webpacker] Compilation Failed
yarn run v0.24.5
$ "/home/deploy/apps/habitat/releases/20170602181402/node_modules/.bin/webpack" --config /home/deploy/apps/habitat/releases/20170602181402/config/webpack/production.js
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Killed
error Command failed with exit code 137.

rake stderr: Nothing written


** DEPLOY FAILED
** Refer to log/capistrano.log for details. Here are the last 20 lines:


 DEBUG [c6892875]



 DEBUG [c6892875]

 DEBUG [c6892875]   Done in 7.01s.

 DEBUG [c6892875]

 DEBUG [c6892875]   Webpacker is installed 🎉 🍰

 DEBUG [c6892875]

 DEBUG [c6892875]   Using /home/deploy/apps/habitat/releases/20170602181402/config/webpacker.yml file for setting up webpack paths

 DEBUG [c6892875]

 DEBUG [c6892875]   [Webpacker] Compiling assets 🎉

 DEBUG [c6892875]

 DEBUG [c6892875]   [Webpacker] Compilation Failed

 DEBUG [c6892875]

yarn run v0.24.5

$ "/home/deploy/apps/habitat/releases/20170602181402/node_modules/.bin/webpack" --config /home/deploy/apps/habitat/releases/20170602181402/config/webpack/production.js

info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.



Killed

error Command failed with exit code 137.
bajalovic picture bajalovic on 2 Jun 2017

@bajalovic I've had that killed error before. The problem was not enough system resources. Restart your server and try again. Maybe stop any other running apps as well. If it still fails, upgrade your server.

flybayer picture flybayer on 2 Jun 2017
👍1

@flybayer I got new droplet on DigitalOcean, with 512MB Ram/1 CPU, 20GB SSD.. This is too small for compiling?

bajalovic picture bajalovic on 2 Jun 2017

@bajalovic yeah, it could be. Node takes a LOT of memory. You can run the top process while compiling to see how much it's taxing your system, but this is almost certainly the issue.

flybayer picture flybayer on 2 Jun 2017

thanks @flybayer, memory was the issue here. I increased instance, and it worked. I also measured while compiling, it took up to ~800mb of ram...

bajalovic picture bajalovic on 5 Jun 2017
👍2

I am getting similar issues and have tried related things in this thread.

I have been purging my cache and verything compiles fine when running locally
NODE_ENV=production RAILS_ENV=production rails assets:precompile --trace

remote:        Webpacker is installed 🎉 🍰
remote:        Using /tmp/build_91d2b3e82c1066b40277d3fb399e94a1/config/webpacker.yml file for setting up webpack paths
remote:        [Webpacker] Compiling assets 🎉
remote:        error Command failed with exit code 2.
remote:
remote:  !
remote:  !     Precompiling assets failed.
remote:  !
remote:  !     Push rejected, failed to compile Ruby app.
remote:
remote:  !     Push failed
remote: Verifying deploy...

Is there anyway to find where the error is?

shaun965 picture shaun965 on 7 Jun 2017
👍4 😄1

@shaun965 In config/webpack/production.js I set warnings: true for the compress setting of the uglify plugin and ended up getting verbose error logging during the compilation process.

zachmalone picture zachmalone on 21 Jun 2017
👍3

It was a memory issue for me as well

paulodeon picture paulodeon on 14 Oct 2018

Failed with no output:

NODE_ENV=production RAILS_ENV=production bundle exec rails assets:precompile --trace
** Invoke assets:precompile (first_time)
** Invoke assets:environment (first_time)
** Execute assets:environment
** Invoke environment (first_time)
** Execute environment
** Invoke yarn:install (first_time)
** Execute yarn:install
yarn install v1.15.2
warning package.json: No license field
warning No license field
[1/4] Resolving packages...
[2/4] Fetching packages...
info [email protected]: The platform "linux" is incompatible with this module.
info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning " > [email protected]" has unmet peer dependency "webpack@^4.0.0".
warning "webpack-dev-server > [email protected]" has unmet peer dependency "webpack@^4.0.0".
[4/4] Building fresh packages...
Done in 5.69s.
** Execute assets:precompile
** Invoke webpacker:compile (first_time)
** Invoke webpacker:verify_install (first_time)
** Invoke webpacker:check_node (first_time)
** Execute webpacker:check_node
** Invoke webpacker:check_yarn (first_time)
** Execute webpacker:check_yarn
** Invoke webpacker:check_binstubs (first_time)
** Execute webpacker:check_binstubs
** Execute webpacker:verify_install
** Invoke environment 
** Execute webpacker:compile
Compiling…
Compilation failed:
warning package.json: No license field

Hash: ef8a4c46aefd8a023d3e
Version: webpack 4.29.6
Time: 554ms
Built at: 2019-03-29 14:26:44
                                        Asset       Size  Chunks             Chunk Names
       js/application-24d579ad03023092387c.js   1.02 KiB       0  [emitted]  application
    js/application-24d579ad03023092387c.js.gz  540 bytes          [emitted]  
   js/application-24d579ad03023092387c.js.map   5.05 KiB       0  [emitted]  application
js/application-24d579ad03023092387c.js.map.gz   1.91 KiB          [emitted]  
                                manifest.json  364 bytes          [emitted]  
                             manifest.json.gz  142 bytes          [emitted]  
Entrypoint application = js/application-24d579ad03023092387c.js js/application-24d579ad03023092387c.js.map
[0] ./app/javascript/packs/application.js 514 bytes {0} [built]
yunixon picture yunixon on 29 Mar 2019
👍5
Was this page helpful?
0 / 5 - 0 ratings

Related issues

suhomlineugene picture suhomlineugene  ·  3Comments
vtno picture vtno  ·  3Comments
swrobel picture swrobel  ·  3Comments
inopinatus picture inopinatus  ·  3Comments
johan-smits picture johan-smits  ·  3Comments