react-app-rewired | Override create-react-app webpack configs | Frontend Framework library

Currently I am using default webpack config of Create React App for babel transpilation. It seems that default babel-loader (in CRA config) uses "babel-preset-react-app". Now all I want is to prevent the transpilation of JS files to ES5 since I don't need to support Internet Explorer. I'm hoping this will bring some gain in the build time.

Versions being used:

• Webpack 4
• Babel Loader 8
• react-app-rewired 2.1
• customize-cra 0.9

./src/App.less (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-8-1!./node_modules/postcss-loader/src??postcss!./node_modules/resolve-url-loader??ref--5-oneOf-8-3!./node_modules/less-loader/dist/cjs.js??ref--5-oneOf-8-4!./src/App.less) TypeError: this.getOptions is not a function

I understood that Ionic cannot handle 'yarn workspace' which build the project with react-app-rewired https://github.com/ionic-team/ionic-cli/issues/4430

As suggested in this post, I configure my monorepo with the multi-app option( https://ionicframework.com/docs/cli/configuration#multi-app-projects)

To valide the project structure, I firstly tried to share a simple constants.

As per this documentation I created a jsconfig.json file in my root directory in order to be able to import components using absolute paths in my React Application (which was set up using create-react-app). Unfortunately this didn't work. I tried installing react-app-rewired along with react-app-rewire-alias to attempt the same, but to no avail. Any help would be appreciated.

The following is my jsconfig.json file:

My app runs successfully but I am getting this error on browser console after using a few components of ant design. When I installed the ant d I done these steps

• npm install antd
• added link tag of antd.compact.min.css to index.html
• added script tag of /antd/4.13.1/antd.min.js to index.html
• added script tag of /antd/4.13.1/antd-with-locales.min.js to index.html

I am new to ReactJs. I need to import an react Component(.tsx) from outside the current project or src. I tried few things like react-app-rewired to remove the ModuleScopePlugin and I imported the component in my project but when I use the component I get an error..

Problem: react-app-rewired start works on App.jsx (and .js too) but not on App.tsx (and .ts too)

Steps

1. I created a boilerplate app with ionic start my-app blank --type=react --capacitor
2. on package.json, i replace and reinstall accordingly (remove package.lock.json, npm i)

I am getting images from folder inside 'src' folder (App is created with 'create-react-app').

• Node js server
  • ...
• client
  • src
    
    • /images
    • index.js
    • package.json
    • ...
  • public

I have form, which after submitting uploads a new image to folder 'client/src/images'. After that page automatically reloads. I have database with user model and this model has image in string format. So after submitting a form a new image is created and pushed in '/images' folder which causes page reload. I need to prevent this. How can I disable react to watching this specific folder? Or as alternative I want to load images outside src directory. I found react-app-rewired, but I really didn't understood it.

I will be grateful for your answer/advice!

I am trying to execute a simple function. But eslient tells me that I have a Parsing error: Unexpected token.