skip to Main Content

I am using the firebase with vite framework for my web poject. Once configured and installed all the necessary programs followed by the actuall production process of the site I was ready to deploy. Once the deployment command Firebase deploy was made, only the index.html, and the respective scripts and styles that are responsible to render a functional page, were depoyed to firebase. I intend to make a multi page site yet I am prevented by this occurrence.
The following is my currently test firebase.json file:

{
  "hosting": {
    "source": "hosting",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "frameworksBackend": {
      "region": "us-east1"
    }
  }
}

My pucblic directory, as was designed in the firebase configuration, is hosting. All my desired html pages are inside this directory and my scripts are in a child directory from hosting.

Multiple attempts of alteration were made in the json file, however still there were no success.
The following is the log result in the build_log.txt file from the npm run build > build_log.txt command:

[email protected] build
tsc && vite build

[36mvite v5.0.5 [32mbuilding for production…[36m[39m
transforming…
[32mÔ£ô[39m 21 modules transformed.
rendering chunks…
computing gzip size…
[2mdist/[22m[32mindex.html [39m[1m[2m 3.05 kB[22m[1m[22m[2m Ôöé gzip: 1.21 kB[22m
[2mdist/[22m[32massets/wemarkIcon-Dz6Y6-tA.jpeg [39m[1m[2m 56.12 kB[22m[1m[22m
[2mdist/[22m[35massets/index-tU7vuZiw.css [39m[1m[2m 5.49 kB[22m[1m[22m[2m Ôöé gzip: 1.82 kB[22m
[2mdist/[22m[36massets/index-nwg7Oc3M.js [39m[1m[2m454.80 kB[22m[1m[22m[2m Ôöé gzip: 106.53 kB[22m
[32mÔ£ô built in 1.80s[39m

2

Answers


  1. Chosen as BEST ANSWER

    I am deeply sorry for my misconception, and ignorance in this matter. It was not a Firebase problem, rather it was a Vite misconfiguration. There was the necessity to determine in a vite.config.ts file if there were other files and where to rewrite those.

    I could find the information and correct guidance in this query and this documentation

    I really apreciate the assistant from those involved. My sincere thanks.


  2. Vite is not a "framework". It is a "development system" that supports many different frameworks (React, Vue, Angular, etc….)

    Vite is used to run the code when you are in "development mode", and it is used to bundle the code into a deployable distribution set when you run vite build (which is typically what you get when you run npm run build or yarn build….see the "scripts" section of your package.json).

    Typically what you want to do to deploy a Vite-backed application is to run vite build and then deploy the results of the build to Firebase Hosting. To do that you would set the hosting.public property in your firebase.json to be the directory where the build output goes from your Vite….that is typically a directory at the root of your project named dist or build.

    Once you build (npm run build) then you deploy (firebase deploy --only hosting).

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search