Webpacker: asset paths inside assets when deploying to sub-url

[ipmsteven]

Problem

Asset paths inside assets when deploying to sub-URI have issue when resolving to right url

Example

When app is mounted under /portal, having a component like Logo below:

import BookLogo from '../images/book_logo.jpg';

 export class Logo extends Component {
    render(){
        return (
          ...
          <img src={BookLogo} />
          ...
        )
    } 
}

The correct path /portal/assets/packs/images/book_logo.jpg is expected but a wrong path /assets/packs/images/book_logo.jpg is generated for src of img on production environment.

Question

Is there a config I can pass like how asset pipeline does by using relative_url_root?

Reference

https://github.com/rails/rails/pull/3946

[gauravtiwari]

@ipmsteven What happens if you set public output path as:

__webpack_public_path__ = `/portal/packs`

__webpack_public_path__ = `/portal/packs`
import BookLogo from '../images/book_logo.jpg';

 export class Logo extends Component {
    render(){
        return (
          ...
          <img src={BookLogo} />
          ...
        )
    } 
}

And then build and deploy to production?

[ipmsteven]

Hi @gauravtiwari ,

Thanks for you reply, that would work but have some manual work involved.

Since webpacker:compile is part of asset pipeline, could we let webpacker:compile
respect the relative_url_root setting from rails?

[bingneef]

If __webpack_public_path__ = '/portal/packs' does not work, make sure to have at least webpacker 3.2.0 in your package.json (yarn add @rails/webpacker), I stared at this for ages since I only updated the gem, not the NPM version.

[linstantnoodles]

@ipmsteven Have you tried configuring your webpacker.yml file to have
public_output_path: portal/packs so that all of your pack assets go to portal/?

[ipmsteven]

@linstantnoodles yes, that could work, but it's not a good solution for my use case.

In my situation /portal is a configurable value, it is stored in a configuration file and different environments has different settings.
(Say for dev: it's '/', for test: it's '/test', for stage, it's '/blah', etc.)

but no matter which environment you are in, it should always the same with relative_url_root(where the app is mounted to)
That's the reason I created this PR https://github.com/rails/webpacker/pull/1236

Does that make sense to you @linstantnoodles ?

[wpp]

Hmm, I've tried __webpack_public_path__ = '/portal/packs' (webpacker 3.2.1 as suggested) but the url is still missing /portal. @bingneef anything else you had to configure?

[brunoOSI]

@linstantnoodles, that locks your generated assets with a given configuration. If you have to deploy the same app to a different path you are in trouble.

@ipmsteven I 👍 your PR, that is awesome and so needed.

[bingneef]

@wpp I believe not, what does your webpacker.yml look like?

[wpp]

I think it's the default configuration.

default: &default                                                               
  source_path: app/javascript                                                   
  source_entry_path: packs                                                      
  public_output_path: packs                                                                    
  # cache_path: tmp/cache/webpacker                                             

  # Additional paths webpack should lookup modules                              
  # ['app/assets', 'engine/foo/app/assets']                                     
  resolved_paths: ['app/assets']                                                

  # Reload manifest.json on all requests so we reload latest compiled packs     
  cache_manifest: false                                                         

  extensions:                                                                   
    - *omitted for brevity*

[bingneef]

@wpp Hmm, mine looks pretty much the same (only changes are that I have compile set to false and cache_path uncommented). The webpacker gem is also ~>3.2.0 right, and the same version as in the package.json? Otherwise I am afraid I have no clue how to provide more assistance..

[gauravtiwari]

Please try the latest RC, otherwise feel free to open a new issue with more details.