Unable to use browserify.yml and commandline_options together

[lynndylanhurley]

I'm trying to split my bundle into two files: deps and application.

Here is my deps file:

//= require react_ujs

require('react');
require('react-router');
require('react-bootstrap');

And here is my application file:

require('routes/app');

Here is my commandline_options setting:

    config.browserify_rails.commandline_options = [
      '-t reactify --extension=".js.jsx"'
    ]

Here is my browserify.yml:

javascript:
  deps:
    require:
      - 'react'
      - 'react-bootstrap'
      - 'react-router'
  application:
    external:
      - 'react'
      - 'react-bootstrap'
      - 'react-router'

Here is the output:

Processing by LandingController#index as HTML
  Rendered landing/index.html.haml within layouts/application (2.3ms)
Browserify: /Users/lynn/Code/Trash/circuit-slave/node_modules/.bin/browserifyinc -t reactify --extension=".js.jsx" --list --cachefile="/Users/lynn/Code/Trash/circuit-slave/tmp/cache/browserify-rails/browserifyinc-cache.json" -o "/Users/lynn/Code/Trash/circuit-slave/tmp/cache/browserify-rails/output20150328-83686-dx9tp9" -
Browserify: /Users/lynn/Code/Trash/circuit-slave/node_modules/.bin/browserifyinc -t reactify --extension=".js.jsx"  --require react --require react-bootstrap --require react-router --cachefile="/Users/lynn/Code/Trash/circuit-slave/tmp/cache/browserify-rails/browserifyinc-cache.json" -o "/Users/lynn/Code/Trash/circuit-slave/tmp/cache/browserify-rails/output20150328-83686-1vlairk" -
Browserify: /Users/lynn/Code/Trash/circuit-slave/node_modules/.bin/browserifyinc -t reactify --extension=".js.jsx" --list --cachefile="/Users/lynn/Code/Trash/circuit-slave/tmp/cache/browserify-rails/browserifyinc-cache.json" -o "/Users/lynn/Code/Trash/circuit-slave/tmp/cache/browserify-rails/output20150328-83686-1n3gaiq" -

So it doesn't look like the external options from the browserify.yml file are being sent to browserify.

When I remove the commandline_options setting, the require and external options are passed to browserify, but obviously the reactify transform doesn't run and the build fails.

I've also tried adding a transform option to the browserify.yml file like this:

javascript:
  deps:
    require:
      - 'react'
      - 'react-bootstrap'
      - 'react-router'
  application:
    external:
      - 'react'
      - 'react-bootstrap'
      - 'react-router'
    transform:
      - '[reactify --extension=.js.jsx]'

But the transform doesn't run and the build fails.

Please let me know if I'm doing something wrong here.

When I tried to debug this I made it to this line. I was expecting the get_granular_config method to return the configuration defined in the browserify.yml file, but the logical_path value was always nil so get_granular_config always returned nil.

[cymen]

What version of browserify are you using? There have been some issues with recent versions and you may need to try browserify v4. Can you do so -- more about that here: browserify/browserify#1019

[lynndylanhurley]

@cymen - I'm using v6.3.4 (the browserify-rails docs said to use ~> 6.3).

It looks like they're up to v9.0.7 now. Does this gem plan to support newer versions of browserify?

I'll try experimenting with different versions tonight.

[cymen]

@lynndylanhurley I realize but try the v4 browserify to determine if that is the issue. If it is that, it appears to be an issue outside of this gem and needs to be fixed outside.

[cymen]

I'll try to get some time to reproduce it locally and look too.

[rstacruz]

got this myself. it doesn't seem to be a problem with browserify, but rather with the gem itself.

It looks like the options in broswerify.yml are being used in lib/browserify-rails/browserify_processor.rb:

    def run_browserify(logical_path=nil, extra_options=nil, force_browserifyinc=nil)
      command_options = "#{options} #{extra_options} #{granular_options(logical_path)}".strip

but at this point, logical_path is actually nil.

[rstacruz]

Nevermind. I got it.

Given this:

javascript:
  deps:
    require:
      - 'react'
  application:
    external:
      - 'react'

Your deps.js file should at least have this line:

/* module.exports */

because otherwise, browserify-rails will skip that file for processing.