Https://weatherapp3-gem8.onrender.com/favorites not opened directly from new tab

Dear Team,

I served the dist folder before deployement.

I added a “start”: “http-server dist -s” script, to package.json.

I made sure I can access the src and href in my index.html file:

this is my render.yaml:

services:

  • type: web
    name: weatherapp
    env: node
    plan: free
    buildCommand: yarn install && yarn build
    startCommand: yarn start
    staticPublishPath: dist
    routes:
    • type: rewrite
      source: /favorites
      destination: /index.html
    • type: rewrite
      source: /.*
      destination: /index.html

this is my package.json:

{
“name”: “weatherapp”,
“private”: true,
“version”: “0.0.0”,
“type”: “module”,
“scripts”: {
“dev”: “vite”,
“build”: “yarn install && vite build”,
“start”: “http-server dist -s”,
“lint”: “eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0”,
“preview”: “vite preview”
},
“dependencies”: {
“@babel/core”: “^7.24.5”,
“@reduxjs/toolkit”: “^1.9.7”,
“dotenv”: “^16.3.1”,
“react”: “^18.2.0”,
“react-dom”: “^18.2.0”,
“react-icons”: “^5.2.1”,
“react-is”: “^18.3.1”,
“react-redux”: “^8.1.3”,
“react-router-dom”: “^6.20.1”,
“styled-components”: “^6.1.1”
},
“devDependencies”: {
“@types/react”: “^18.2.37”,
“@types/react-dom”: “^18.2.15”,
“@vitejs/plugin-react”: “^4.2.0”,
“eslint”: “^8.53.0”,
“eslint-plugin-react”: “^7.33.2”,
“eslint-plugin-react-hooks”: “^4.6.0”,
“eslint-plugin-react-refresh”: “^0.4.4”,
“http-server”: “^14.1.1”,
“vite”: “^5.0.0”
},
“resolutions”: {
“styled-components”: “^5”
}
}

BR, Tal

please see atachment


My browser just shows 404

Hi there,

I see you are defining both a startCommand and a staticPublishPath. A startCommand is only used for web services, whereas a staticPublishPath is used for static sites.

I also see you defining some rewrite rules, so I assume you were actually trying to deploy a static site. You’ll need to set runtime: static, removing env: node.

I’d suggest reviewing docs.render.com/static-sites as a good place to start. It can also be helpful not to start out with a blueprint when you’re just familiarizing yourself with Render. You can always create services and then export them to a blueprint once you have the basics working.

Regards,

Matt

Hi,

I did a static deployement,
removed the startCommand and ‘env: node’ and set ‘runtime: static’. this is my render.yaml file now:

services:

  • type: web
    name: weatherapp
    runtime: static
    plan: free
    buildCommand: yarn install && yarn build
    staticPublishPath: dist
    routes:
    • type: rewrite
      source: /favorites
      destination: /index.html
    • type: rewrite
      source: /.*
      destination: /index.html

When I deployed is a static I see in the console that my site is live, but I have an error in my console:

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of “binary/octet-stream”. Strict MIME type checking is enforced for module scripts per HTML spec.

Does it mean I need to change all my .jsx ending files to .js ?

(sorry for writing it the second time, I can’t see the reply from you to my previous topic)

BR, Tal.

Hi, I need this site as a web service, I have another issue opened.
BR, Tal

Hi tal,

It looks like Mike is helping you in your other thread: https://community.render.com/t/deployed-my-react-app-as-static-site-is-live-but-page-is-white/22065/1.

I’ll close this one out to avoid duplicating efforts and confusing threads.

Regards,

Matt