4

I have a use case where I'm dynamically storing a pdf file in my public folder. public/print-preview/.

The issue here is that the application reloads and the state gets lost after such a file was created and stored.

How can I exclude such a folder from being watched? And is there a way to achieve this without ejecting?

Nemanja Milosavljevic
  • 1,251
  • 18
  • 33

2 Answers2

1

from https://github.com/facebook/create-react-app/issues/2541 :

I don't think we'll do this as it seems like people generally don't use public folder for uploads. And it wouldn't work in production anyway.

I would recommend to use a separate server (which you need anyway) and separate folder for image uploads, and have the app load images from a different host/port (just like it would in production, e.g. from a CDN).

Fraction
  • 11,668
  • 5
  • 28
  • 48
1

You can open the file node_modules\react-scripts\config\webpackDevServer.config.js and change the watchOptions.ignored setting to include the public folder like this:

watchOptions: {
  ignored: [ ignoredFiles(paths.appSrc), paths.appPublic ]
},

Of course this is only temporary as reinstall/updates to node_modules will remove this.

Patrick64
  • 430
  • 6
  • 12
  • This causes an error for me because `devServer.watchOptions` is not a valid API option. You can see valid options [here](https://webpack.js.org/configuration/dev-server/#devserverwatchfiles). – Lewy Blue May 08 '22 at 23:20
  • It looks like you should use `devServer.watchFiles` instead, which uses [Chokidar](https://github.com/paulmillr/chokidar) so you can use any valid options from that. However, I have tried settings a couple of files to be ignored by chokidar and it doesn't seem to have any effect. I even tried ignoring everything: `devServer.watchFiles.options.ignore = ['**/*.*']` but nothing changed – Lewy Blue May 08 '22 at 23:25