Menyebarkan

Vite-React Deploy Heroku

TEMPLATE:
	vanilla, vanilla-ts, vue, vue-ts, 
  	react, react-ts, preact, preact-ts, lit,
  	lit-ts, svelte, svelte-ts

# npm 7+, extra double-dash (-- --template react) is needed:
npm create vite@latest my-react-app -- --template react
# yarn
yarn create vite my-react-app --template react
# pnpm
pnpm create vite my-react-app -- --template react

cd my-react-app
git init

``` package.json
 "scripts": {
    "dev": "vite --host",
    "build": "vite build",
    "preview": "vite preview --host",
    "start": "serve -s public",
    "heroku-postbuild": "npm run build"
  },
  "dependencies": {
    "daisyui": "^2.15.0",
    "flowbite": "^1.4.5",
    "react": "^18.1.0",
    "react-dom": "^18.1.0",
    "react-scripts": "^5.0.1",
    "serve": "^13.0.2"
  },
  "devDependencies": {
    "@types/react": "^18.0.9",
    "@types/react-dom": "^18.0.4",
    "@vitejs/plugin-react": "^1.3.2",
    "autoprefixer": "^10.4.7",
    "postcss": "^8.4.13",
    "tailwindcss": "^3.0.24",
    "vite": "^2.9.9"
  }
```

```vite.config.js
import { build, defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

// https://vitejs.dev/config/

export default defineConfig({
  server: {
    port: 2736
  },
  preview: {
    port: 8080
  },
  build: {
    outDir: './public',
  },
  plugins: [react()]
})
```
heroku login

heroku create my-react-app
heroku buildpacks:set heroku/nodejs

heroku git:remote -a my-react-app

heroku config:set HOST=0.0.0.0
heroku config:set NPM_CONFIG_PRODUCTION=false
heroku config:set MODE_ENV=production
///////////////////////////////////////////////////
/// Si esta en master y quiere renombrar a main
/// haga esto

/// crear branch main 
git checkout -b main

/// borar master
git branch -D master
///////////////////////////////////////////////////

git add .
git commit -am "Final OK"
git push heroku main 

Listo...!!!
  
JCC