Deployment 🚀

This section contains useful information for building and deploying an application.

Pull requests to add other providers are welcome!

Build 📦

If you used the starter, the default configuration to build your site is:

• Build Command: npm run build
• Output Directory: dist

Else, you could manually add a "build": "iles build", script to your package.json.

Like in most Vite.js projects, the default output dir is /dist.

pnpm

pnpm is not supported out of the box in most providers, but you can still use it.

In most cases, that requires manually installing dependencies by prepending an install command to the configured Build Command:

npx pnpm i --store=node_modules/.pnpm-store && npx pnpm run build

Cloudflare Pages

To deploy in Cloudflare Pages, you will need to create a project and configure:

• Build Command: npm run build
• Output Directory: dist

Additionally, since the default version of node is 12.18.0, you will need to set the NODE_VERSION environment variable to 14.18.1 or higher.

Netlify

Add a netlify.toml file to your project:

[build]
  publish = "dist"
  command = "npm run build"

[build.environment]
  NODE_VERSION = "16"
  # NPM_FLAGS = "--version" # uncomment if using pnpm to skip npm install

Then, push to your git repository as usual.

Vercel

Add a vercel.json file to your project to match the behavior of Vue Router:

{
  "cleanUrls": true,
  "trailingSlash": false
}

Alternatively, you can disable prettyUrls, which will explicitly add .html in link hrefs, and trailing slashes on index html files.

Then, push to your git repository as usual.

GitHub Pages

To deploy in GitHub Pages, add a workflow like the following using actions-gh-pages:

name: Deploy îles site

on:
  push:
    branches:
      - main

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2

      - name: Use Node.js
        uses: actions/setup-node@v1
        with:
          node-version: 16.x

      - uses: pnpm/action-setup@v1.2.1
        with:
          version: 6.10.3
          run_install: |
            - recursive: false

      - name: Build Site
        run: npm run build

      - name: Deploy Site
        uses: peaceiris/actions-gh-pages@v3
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}
          publish_dir: ./dist

.github/workflows/deploy.yml

The example above assumes pnpm, but you can use a different package manager and adjust the workflow accordingly.

Read the actions-gh-pages docs for more information on configuration, and make sure to manually enable gh-pages if it's the first deployment with GITHUB_TOKEN.