Cloudflare Pages部署静态网站

最近弄了个野鸡edu域名,利用教育邮箱薅完羊毛后为了不浪费以及找点乐子那就建个站玩玩吧,既然是一个静态页面就直接放Cloudflare托管了。庆樱大学官网:https://keio.edu.kg

Cloudflare Pages 是什么

Cloudflare Pages 是一个静态网站托管服务,可以方便地部署静态网站,包括HTML、CSS、JavaScript 等。它与Git 仓库集成,可以自动构建和部署,并提供免费的SSL 证书和全球CDN 加速。

部署过程

部署很简单5分钟搞定的那种,登录到Cloudflare后点击左边计算(Workers)菜单下的Workers和Pages,点击创建 选择pages



这里有两种部署方式,导入现有git存储库或直接上传本地文件,这里为了方便后续修改内容和重新构建推荐通过github导入。
进入通过github部署的界面,没有绑过github账号的可添加账号,选择账户下的仓库。

关键点来了!下面这步「设置构建和部署」就很关键了,设置错了会部署失败。

这里的重点是构建命令和构建输出目录。
像用npm打包的话就用npm run build默认构建目录就是index.html文件所在的dist文件夹。这里可查阅官方给的配置构建说明

像我这次部署的完全就是一个html的静态文件,那么就无需打包,构建命令处可填exit 0,构建输出目录就直接填index.html所在的文件夹名。这里是敲黑板的重点!目录填错后部署好的网站是打不开的!
最后部署完后可根据提示在DNS里添加一条CNAME记录绑下域名就完成了。

自动部署

这就是为什么推荐通过github导入的原因了,每当在github修改过代码后Cloudflare会即刻自动进行重新部署!非常的方便!

暂无评论

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇