Assets (Image/CSS/jquery) NOT LOADING

Did you try to build your app on localhost.

The package.json doesn’t look like it isn’t edited by ReactPress, thus the assets are not loaded properly.

The build command should look similar like this. You can edit your package.json manually like this (Assuming the path fits your WordPress installation):

...
"build": "PUBLIC_URL=/wp-content/reactpress/apps/[your-app-name]/build react-scripts build"
...

Let me know, if it helps.

Btw, the jQuery issue is a separate problem and should have nothing to do with ReactPress – assuming you don’t use jQuery as a dependency in your React app.

This is the package.json file

{
  "name": "sefali",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.16.4",
    "@testing-library/react": "^13.3.0",
    "@testing-library/user-event": "^13.5.0",
    "animate.css": "^4.1.1",
    "animate.css-react": "^1.1.0",
    "aos": "^2.3.4",
    "gotham-fonts": "^1.0.3",
    "react": "^18.1.0",
    "react-animate-on-scroll": "^2.1.5",
    "react-animation-on-scroll": "^5.1.0",
    "react-dom": "^18.1.0",
    "react-jquery-plugin": "^1.1.7",
    "react-multi-carousel": "^2.8.2",
    "react-router-dom": "^6.3.0",
    "react-scripts": "^5.0.1",
    "react-slick": "^0.29.0",
    "slick-carousel": "^1.8.1",
    "tachyons": "^4.12.0",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "PUBLIC_URL=/test react-scripts start",
    "build": "PUBLIC_URL=/wp-content/reactpress/apps/honeweb/build react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

And I hope you are already aware of the WordPress file structure.

Also, this is the frontend of the website – https://ec2-43-205-189-241.ap-south-1.compute.amazonaws.com/

• This reply was modified 2 years, 5 months ago by Pawan Singh Bisht.
• This reply was modified 2 years, 5 months ago by Pawan Singh Bisht.

From what I see, your dev system and your live system didn’t match.

On your dev system you use the slug /test on your live system you use /.

You need to use /test on your live system too. Please use the exact same app configuration on both systems.

"start": "PUBLIC_URL=/test react-scripts start",
    "build": "PUBLIC_URL=/test/wp-content/reactpress/apps/honeweb/build react-scripts build",

like this?

It’s weird. After running the build command I got the build folder and I’ve placed this in the route folder but from here I can access the

/images folder

With slug I mean the route/url to the WordPress page where your React app is embedded. The public_url of the build script shouldn’t be changed.

Could you please test your app with localWP first if it works.

I don’t have any experience with AWS and can’t really support you with it.

Okay fine. Everything is wokring fine.

Just let me know if I’ll add the build to the live site, root of the site thenit’ll open as

https://ec2-43-205-189-241.ap-south-1.compute.amazonaws.com/build

right?

I want, it should open as https://ec2-43-205-189-241.ap-south-1.compute.amazonaws.com/

without the slug.

Oh no, you need to install ReactPress on the live site, create a page there and create the same folder in your reactpress directory and push the build folder there.

Please refer to the documentation: https://rockiger.com/en/reactpress/getting-started/#deploy