Skip to content

Commit

Permalink
Upgrade from vuepress to vitepress
Browse files Browse the repository at this point in the history
  • Loading branch information
jaylinski committed Feb 16, 2024
1 parent 6ad862e commit 8abac40
Show file tree
Hide file tree
Showing 205 changed files with 4,611 additions and 41,856 deletions.
12 changes: 0 additions & 12 deletions .babelrc

This file was deleted.

8 changes: 0 additions & 8 deletions .eslintignore

This file was deleted.

47 changes: 0 additions & 47 deletions .eslintrc.js

This file was deleted.

5 changes: 3 additions & 2 deletions .github/workflows/build-and-deploy.yml
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ on:
push:
branches:
- master

jobs:
build-and-deploy:
runs-on: ubuntu-latest
Expand All @@ -13,9 +14,9 @@ jobs:
- uses: actions/checkout@v1
- uses: actions/setup-node@v1
with:
node-version: 16
node-version: '20'
- run: npm ci
- run: npm run test-and-build
- run: npm run docs:build

- name: Deploy to ${{ env.TARGET_URL }}
uses: peaceiris/actions-gh-pages@v3
Expand Down
2 changes: 1 addition & 1 deletion .github/workflows/ci.yml
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ jobs:
- name: Setup Node.js
uses: actions/setup-node@v2
with:
node-version: '16'
node-version: '20'

- name: Install dependencies
run: npm ci
Expand Down
9 changes: 5 additions & 4 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
node_modules
target
.idea
/*.iml
/src/.vitepress/.temp
/src/.vitepress/cache
/src/.vitepress/dist
/node_modules
/target
11 changes: 3 additions & 8 deletions .prettierignore
Original file line number Diff line number Diff line change
@@ -1,8 +1,3 @@
node_modules
target
.idea
!.vuepress
/src/usage-examples/precompilation/example.precompiled.js
/src/usage-examples/precompilation/precompile-in-nodejs.output.js
/src/*/usage-examples/precompilation/example.precompiled.js
/src/*/usage-examples/precompilation/precompile-in-nodejs.output.js
!.vitepress
/src/snippets/precompilation/example.precompiled.js
/src/snippets/precompilation/precompile-in-nodejs.output.js
15 changes: 0 additions & 15 deletions .vscode/launch.json

This file was deleted.

43 changes: 15 additions & 28 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
# Development setup

This site uses [VuePress](https://v1.vuepress.vuejs.org/) as static page generator. It is a static page generator based
This site uses [VitePress](https://vitepress.dev/) as static page generator. It is a static page generator based
on [Vue.js](https://vuejs.org/) and created to write the documentation of that framework.

VuePress is based on markdown files. Each HTML-page on the site has a corresponding markdown file in this repository.
VitePress is based on markdown files. Each HTML-page on the site has a corresponding markdown file in this repository.

# Requirements and recommended tools

The following tools are required to build and develop the site.

- NodeJS (latest LTS) and the corresponding version of `npm`
- Node.js (latest LTS) and the corresponding version of `npm`

The following tools will help you developing

Expand All @@ -24,25 +24,23 @@ The following tools will help you developing
After cloning the repository you probaby want to run the following commands:

- `npm install` (required) installs the dependencies libraries and is required for building the site.
- `npm run dev` runs a webpack-dev-server, usually on port 8080. This server features live-reloading. Styles will
- `npm run docs:dev` runs a vite-dev-server. This server features live-reloading. Styles will
automatically be updated when you change the source files. Changes in markdown changes and Vue.js components will be
visible immediately. _Note that changes to the file `src/.vuepress/config.js` are not part of the live-reload and
visible immediately. _Note that changes to the file `src/.vitepress/config.js` are not part of the live-reload and
require a restart of the command._
- `npm run preview` should be run prior to creating a pull-request. It will clean the build-directories, run tests and
- `npm run docs:preview` should be run prior to creating a pull-request. It will clean the build-directories, run tests and
linters, the site. A production-like preview of the site can be viewed at port 9080

Other commands are not needed as often:

- `npm run fix` trys to fix all `eslint` errors and runs `prettier` to format everything. This is also done in a
pre-commit hook so it should not be necessary to run this command manually.
- `npm run clean` removes all cached and built files. This can be helpful if you have errors that you cannot explain and
that just won't go away.
- The scripts `test`,`lint`, `format` and `build` just exist to make the other commands in the `package.json` more
- The scripts `test`,`lint`, `format` and `docs:build` just exist to make the other commands in the `package.json` more
readable.

## Differences between dev-server and production

The VuePress site is a Vue.js application. While the dev-server runs the whole application in the browser, the
The VitePress site is a Vue.js application. While the dev-server runs the whole application in the browser, the
production site is pre-rendered with subsequent changes running in the browser.

Vue.js components that only work in the browser will work correctly in the dev-server, but will fail in production.
Expand All @@ -60,24 +58,13 @@ A few notes on the site and the build processes

The `src` folder contains all sources of the page. That includes

- `src/**/*.md`: Markdown files, one for each HTML files containing the actual content.
- `src/.vuepress/styles`: [stylus](http://stylus-lang.com/) files that adjust the CSS styles of the website (TODO add
documentation link)
- `src/.vuepress/components`: custom Vue.js components and Layouts created for this site (TODO add documentation link)
- `src/.vuepress/public/`: root directory for public files that are copied to the site as-is.
- `src/.vuepress/plugins/`: VuePress-plugins created for this site.
- `src/**/*.md`: Markdown files, one for each HTML files containing the actual content
- `src/.vitepress/styles`: CSS files that adjust the styles of the website
- `src/.vitepress/components`: custom Vue.js components and Layouts created for this site
- `src/.vitepress/public/`: root directory for public files that are copied to the site as-is
- `src/.vitepress/plugins/`: VitePress-plugins created for this site

# Deployment

The deployment has two phases:

- The preview site at https://handlebars-draft.knappi.org is automatically updated when changes are pushed to the
`master`-branch. The Github-pages are hosted in the `gh-pages`-branch of this repository.
- The production site (currently the temporary site https://handlebars-prod.knappi.org) is updated when changes are
pushed to the `production`-branch. The Github-pages for the production site are hosted in the `master`-branch of the
[docs-prod-ghpages](https://github.com/handlebars-lang/docs-prod-ghpages) repository.

In both cases, the deployment itself is performed via [Travis-CI job](https://travis-ci.org/handlebars-lang/docs)

The Travis-CI job uses the [handlebars-site-bot](https://github.com/handlebars-site-bot) account to update the
github-pages of this repository.
The site at https://handlebarsjs.com is automatically updated when changes are pushed to the
`master`-branch. The Github-pages are hosted in the `gh-pages`-branch of this repository.
23 changes: 0 additions & 23 deletions README.markdown

This file was deleted.

24 changes: 24 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
[![CI](https://github.com/handlebars-lang/docs/actions/workflows/ci.yml/badge.svg)](https://github.com/handlebars-lang/docs/actions/workflows/ci.yml)

This is the repository for the Handlebars documentation site.

* Target-URL: https://handlebarsjs.com

# Why VitePress?

There are a lot of static page generators out there nowadays.
I have chosen [VitePress](https://vitepress.dev/) over other systems for several reasons:

* I like [vuejs](https://vuejs.org).
* VitePress builds fast loading static sites with modern PWA technologies.
* VitePress is centered around markdown, but leaves the opportunity to inject interactive parts if needed.
* VitePress has a simple predefined way of adapting stylesheets, which makes it easy to adapt colors from the
original site without rewriting the whole css
* The vuejs documentation site is build with VitePress, so it will hopefully be around for a while.

You can challenge me and propose other solutions, but you might be asked to help out if you do.

-- Nils

:rocket: :rocket:

Loading

0 comments on commit 8abac40

Please sign in to comment.