Total Pageviews

Saturday, 21 December 2024

搭建静态博客程序 svelte-QWER

 首先搭建nodejs环境。然后,

npm install -g pnpm
git clone https://github.com/kwchang0831/svelte-QWER
cd svelte-QWER
pnpm install
pnpm build (此即生成/更新静态网站的根目录的命令。此命令会在当前目录下生成build目录) 

cd build

$ ls
 _app/               example.html      manifest.webmanifest   versions.json
 about.html          favicon.ico       quick-start.html      
 atom.xml            favicon.png       robots.txt            '~partytown'/
 feed.json         service-worker.js
 hello-QWER.html   sitemap.xml
 example/       index.html

(可见~/svelte-qwer/build目录就是静态网站的根目录)

新建源帖:

cd ~/svelte-qwer/user/blogs

~/svelte-qwer/user/blogs (main) $ ls
about/  example/  hello-QWER/  quick-start/ 
~/svelte-qwer/user/blogs (main) $ mkdir test

~/svelte-qwer/user/blogs (main) $ cp quick-start/* test/

~/svelte-qwer/user/blogs (main) $ cd test

~/svelte-qwer/user/blogs/test (main) $ ls
cover.jpg  index.md 

~/svelte-qwer/user/blogs/test (main) $  nano index.md

~/svelte-qwer/user/blogs/test (main) $ cat index.md

显示:

---
title: 测试
description: good
summary: ✨ 测试一下
published: '2024-12-21T10:20:00.000+08:00'
updated: '2024-12-21T10:20:00.000+08:00'
cover: ./cover.jpg
coverCaption: Photo by <a href="https://unsplash.com/ja/@mxhpics?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Maxime Horlaville</a> on <a href="https://unsplash.com/s/photos/start?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>
tags:
  - [QWER]
---

测试一下。

看看如何?


cd ~/svelte-qwer/

pnpm build
然后上传~/svelte-qwer/build目录的内容到https://app.netlify.com/drop,得到网址-
演示网址:https://scintillating-cat-bfdf34.netlify.app/
项目地址:https://github.com/kwchang0831/svelte-QWER
 
 


 



 




 

No comments:

Post a Comment