React production using react-app-rewired-alias

Question

I need to import mp3 files from outside of electron app. But react does not accept import outside of src. That's why i use react-app-rewired and react-app-rewired-alias. When electron start first time, I create downloads directory under appData folder and then mp3 files were imported from there. I think in production it tries to import mp3 files before downloads directory creating. How can I execute it in production as well?

By the way, in development everything works fine but in production I take an error which says "userDataPath/downloads module can not be found."

//config-overrides.js  (rtp is name of my app.)

const getAppDataPath = require('appdata-path')
const { alias } = require('react-app-rewire-alias')

module.exports = function override(config) {
  alias({
    userDataPath: getAppDataPath() + '/rtp',
  })(config)

  return config
}

// I try to import mp3 files like this:

 <audio
   src={require(`userDataPath/downloads/${currentSongFileId}`)} 
 />

 //package.json scripts

 "dev": "concurrently \"npm start\" \"wait-on http://localhost:3000 && electron .\"",
 "start": "react-app-rewired start",
 "build": "react-app-rewired build",

Answer 1

Can you try to create downloads directory in pre command for starting the application? like

"prestart": "mkdirp ./app && mkdirp ./app/downloads"