mix phx.sync.tanstack_db.setup (Phoenix.Sync v0.6.1)

View Source

Convert a Phoenix application to use a Vite + Tanstack DB based frontend

This is a very invasive task that does the following:

  • Removes esbuild with vite and removes the Elixir integration with tailwindcss

  • Adds a package.json with the required dependencies for @tanstack/db, @tanstack/router, react and tailwind

  • Drops in some example routes, schemas, collections and mutation code

  • Replaces the default root.html.heex layout to one suitable for a react-based SPA

For this reason we recommend only running this on a fresh Phoenix project (with Phoenix.Sync installed).

Example 

# install igniter.new
mix archive.install hex igniter_new

# create a new phoenix application and install phoenix_sync in `embedded` mode
mix igniter.new my_app --install phoenix_sync --with phx.new --sync-mode embedded

# setup my_app to use tanstack db
mix phx.sync.tanstack_db.setup

Options

  • --sync-pnpm - Use pnpm as package manager if available (default)
  • --no-sync-pnpm - Use npm as package manager even if pnpm is installed