Repository navigation
Applications served from cdn on different host #647
Description
I'm in the process of converting our companies internal boilerplate into something that uses create-react-app.
We load all of our applications into html rendered by rails views in our application. Js/css/etc built by webpack is served via cdn.
In our boilerplate we look in the env for CDN_URL and set that as publicpath. This cdn url is provided in local dev by a .env file (loaded via dotenv module) and during deploys by the build server.
In trying to keep with 12 factor app methodology we don't commit these urls to the codebase.
Seems like publicpath is only currently modifiable by editing package.json.
Would it be possible to use something like REACT_APP_STATIC_URL (or any other, better name) in order to construct the publicpath for webpack?
Activity
drobannx commentedon Sep 15, 2016
I have a similar issue. I need the resulting index.html to have its link and script tags point to a url that has a CDN url prefixed to the fingerprinted assets. Right now I see no way of achieving this without abusing the homepage property in package.json by doing
//https://pathToCDN.comWould it be possible to do something like
CDN_URL=https://pathToCDN.com npm run build? Or is there another route in order to achieve this that I am missing?SeeThruHead commentedon Sep 15, 2016
I'm in the process of forking create-react-app to handle a few things specific to my companies needs, which includes this feature. (I've implemented it as process.env.HOMPAGE) currently. I could make a pr for this if it's coherent with create-react-app's scope and philosophy.
skyuplam commentedon Sep 21, 2016
I need the same stuff as well. I have made a small change to the build script and added
publicPathto the package.js file as a workaround. 😈Ref: Webpack Config - -publicpath
gaearon commentedon Sep 21, 2016
I’m open to merging support for
CDN_URLenv variable.SeeThruHead commentedon Sep 21, 2016
Working on it
mcallistersean commentedon Sep 30, 2016
I solved a similar problem where I needed absolute urls in development builds.
Without modifying the webpack config used by create-react-app it is possible to inject the publicPath at runtime by using a global variable.
I added a file (publicPath.js) with this content to the src folder:
and imported it right at the top of the index.js.
It's kind of important that it is imported before any other file and just defining the variable insidethe index.js also does not work because all imports are hoisted to the top of the file.
gaearon commentedon Sep 30, 2016
Interesting. We don’t officially support this so it might break in the future.
mcallistersean commentedon Sep 30, 2016
Yep, it's a hack and probably should not even work.
Related to this issue: would you be interested in a pull request to the hot reloading client that connects to the server that actually served the hot reloading script instead of window.location.hostname etc. as is currently the case.
Something like what I did here: e142fbd
That would make this project even easier to integrate into non-js backends.
gaearon commentedon Sep 30, 2016
Right now I’m wary of increasing surface area for bugs. I don’t want to make this as complicated as WDS client. I still plan to make changes to it, so I intend to keep it scoped to features CRA supports, and serving JS from a different host or port is not supported right now.
jjasonclark commentedon Nov 5, 2016
This seems a bit related to PR #937. Adding for context.
Timer commentedon Feb 11, 2017
Hi there!
react-scriptsv0.9.0 was just released which adds support for specifying a CDN url. You may read how to configure it here.Please test it and don't hesitate to reach out if this doesn't solve your specific use case!
gaearon commentedon Feb 11, 2017
Going to close this.