Skip to content

Commit

Permalink
add Vite and related frameworks readme (firebase#6289)
Browse files Browse the repository at this point in the history
* add svelte.md

* consolidate to vite.md

* pr comments
  • Loading branch information
austincrim authored and JulienMartel committed Aug 29, 2023
1 parent a89ff27 commit fc42b1f
Show file tree
Hide file tree
Showing 5 changed files with 61 additions and 48 deletions.
3 changes: 3 additions & 0 deletions src/frameworks/docs/lit.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
# Integrate Lit

Lit support is built on the Vite framework integration. See [vite.md](./vite.md) for full guidance.
3 changes: 3 additions & 0 deletions src/frameworks/docs/preact.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
# Integrate Preact

Preact support is built on the Vite framework integration. See [vite.md](./vite.md) for full guidance.
49 changes: 1 addition & 48 deletions src/frameworks/docs/react.md
Original file line number Diff line number Diff line change
@@ -1,50 +1,3 @@
# Integrate React

Using the Firebase CLI, you can deploy your React static web apps to Firebase
and serve them with Firebase Hosting.

Note: Framework-aware Hosting is an early public preview. This means
that the functionality might change in backward-incompatible ways. A preview
release is not subject to any SLA or deprecation policy and may receive limited
or no support.

## Before you begin

Before you get started deploying your app to Firebase,
review the following requirements and options:

- Firebase CLI version 12.1.0 or later. Make sure to
[install the CLI](https://firebase.google.com/docs/cli#install_the_firebase_cli) using your preferred
method.
- Optional: An existing React project using Vite. You can create one with
`npm create vite@latest -- --template react` or let the Firebase CLI
[initialize a new project](#initialize-a-new-project) for you.


## Initialize Firebase

To get started, initialize Firebase for your framework project.
Use the Firebase CLI for a new project, or modify `firebase.json` for an
existing project.

### Initialize a new project

1. In the Firebase CLI, enable the web frameworks preview:
<pre class="devsite-terminal">firebase experiments:enable webframeworks</pre>
1. Run the initialization command from the CLI and then follow the prompts:
<pre class="devsite-terminal">firebase init hosting</pre>
1. Answer yes to "Do you want to use a web framework? (experimental)"
1. Choose your hosting source directory. If there is an existing React
codebase (with Vite), the CLI detects it and the process completes.

## Serve static content

After initializing Firebase, you can serve static content with the standard
deployment command:

```shell
firebase deploy
```

You can [view your deployed app](/docs/hosting/test-preview-deploy#view-changes)
on its live site.
React support is built on the Vite framework integration. See [vite.md](./vite.md) for full guidance.
3 changes: 3 additions & 0 deletions src/frameworks/docs/svelte.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
# Integrate Svelte

Svelte support is built on the Vite framework integration. See [vite.md](./vite.md) for full guidance.
51 changes: 51 additions & 0 deletions src/frameworks/docs/vite.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
# Integrate Vite

Using the Firebase CLI, you can deploy your Vite-powered sites to Firebase
and serve them with Firebase Hosting. The following instructions also apply
to React, Preact, Lit, and Svelte as they are built on the Vite integration.

Note: Framework-aware Hosting is an early public preview. This means
that the functionality might change in backward-incompatible ways. A preview
release is not subject to any SLA or deprecation policy and may receive limited
or no support.

## Before you begin

Before you get started deploying your app to Firebase,
review the following requirements and options:

- Firebase CLI version 12.1.0 or later. Make sure to
[install the CLI](https://firebase.google.com/docs/cli#install_the_firebase_cli) using your preferred
method.
- Optional: An existing Vite project. You can create one with
`npm create vite@latest` or let the Firebase CLI
initialize a new project for you.


## Initialize Firebase

To get started, initialize Firebase for your framework project.
Use the Firebase CLI for a new project, or modify `firebase.json` for an
existing project.

### Initialize a new project

1. In the Firebase CLI, enable the web frameworks preview:
<pre class="devsite-terminal">firebase experiments:enable webframeworks</pre>
1. Run the initialization command from the CLI and then follow the prompts:
<pre class="devsite-terminal">firebase init hosting</pre>
1. Answer yes to "Do you want to use a web framework? (experimental)"
1. Choose your hosting source directory. If there is an existing Vite codebase,
the CLI detects it and the process completes.

## Serve static content

After initializing Firebase, you can serve static content with the standard
deployment command:

```shell
firebase deploy
```

You can [view your deployed app](https://firebase.google.com/docs/hosting/test-preview-deploy#view-changes)
on its live site.

0 comments on commit fc42b1f

Please sign in to comment.