Published on

Development ๐Ÿ’ป


Run exe/dev (added during installation) to start both Vite and Jekyll for development.

It will use your config/vite.json configuration, which can be used to configure the host and port, as well as other options.

Visit your Jekyll site and you should see a printed console output: Vite โšก๏ธ Ruby.

Alternatively, run bin/vite dev to start the Vite development server, and restart your Jekyll server with bin/jekyll serve once Vite is running.

Entrypoints โคต๏ธ

Any files inside your entrypointsDir will be considered entries to your application.

_frontend: sourceCodeDir
  โ”œโ”€โ”€ entrypoints: entrypointsDir
  โ”‚   # only Vite entry files here
  โ”‚   โ””โ”€โ”€ application.js
  โ”‚   โ””โ”€โ”€ typography.css
  โ””โ”€โ”€ components:
  โ”‚   โ””โ”€โ”€ App.jsx
  โ””โ”€โ”€ stylesheets:
  โ”‚   โ””โ”€โ”€ main.scss
  โ””โ”€โ”€ images:
      โ””โ”€โ”€ logo.svg

These files will be automatically detected and passed on to Vite, all configuration is done for you.

You can add them to your HTML layouts or views using the provided tag helpers.

Import Aliases ๐Ÿ‘‰

For convenience, ~/ and @/ are aliased to your sourceCodeDir, which simplifies imports:

import App from '~/components/App.jsx'
import '@/stylesheets/main.scss'

CLI Commands โŒจ๏ธ

A CLI tool is provided, you can run it using bundle exec vite, or bin/vite after installation.

For information about the CLI options run bin/vite --help.