Add path when webpack creates static asset files react, create react app

Question

I have a react application, which I built with create react app, when I run build it generates the static assets I need and then the index.html file. I am running this on a Ratpack server with gradle. I then use gradle to move these files to my Ratpack directory so I can run it with the Ratpack server. When I move the files I need to add /assets/ onto the url for the JS and CSS file.

For example at the moment it creates the path like this

<script type="text/javascript" src="/static/js/main.dab68f70.js">

where as I need

<script type="text/javascript" src="assets/static/js/main.dab68f70.js">

Is it possible to somehow automate this as each time I run my application the files in my ratpack assets are overwritten by the new files.

Michal Cumpl · Accepted Answer · 2017-02-10 13:10:45Z

4

What about configuring Webpack output publicPath like this?

output: {
    ...    
    publicPath: "assets",
}

I am using this with Webpack 1.x

The docs can be found here: http://webpack.github.io/docs/configuration.html#output-publicpath

answered Feb 10, 2017 at 13:10

Michal Cumpl

1,0379 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

N P Over a year ago

Where abouts does the config,js file go? I don't have one, I used the create react app

Michal Cumpl Over a year ago

There is a webpack.config.js file in the root of your project.

N P Over a year ago

I used create react app, the only thing in the root of my project is build.gradle, package.json and yarn.lock

Michal Cumpl Over a year ago

You are right, there is no webpack.config.js when you generate the app uding create react app. More info here github.com/facebookincubator/create-react-app/issues/99

Lee Loftiss · Accepted Answer · 2020-02-25 00:47:13Z

2

3 Years later......

I had this issue today. And found all the same answers I'm sure you did.

Here is how I fixed it, I went into the index.html file that loads those few files and changed the path manually.

Took about 3 minutes.

answered Feb 25, 2020 at 0:47

Lee Loftiss

3,2257 gold badges50 silver badges75 bronze badges

Comments

N P · Accepted Answer · 2017-02-12 16:35:46Z

0

In the end I used npm eject, this then exposes all the config files for webpack. From here I edited my webpack config to get my desired paths for my assets.

answered Feb 12, 2017 at 16:35

N P

2,6497 gold badges38 silver badges59 bronze badges

Comments

Abhijith Sasikumar · Accepted Answer · 2020-05-22 02:33:53Z

0

You can add "homepage": ".", in your package.json file. It will make the build files with relative path. Bit weird though, but it worked for me.

answered May 22, 2020 at 2:33

Abhijith Sasikumar

15.3k4 gold badges34 silver badges46 bronze badges

Collectives™ on Stack Overflow

Add path when webpack creates static asset files react, create react app

4 Answers 4

4 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

4 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related