如何通过Netlify部署简单静态网站

上回的文章中,我们提到过使用github page的方式,来上传并配置自己的简单网站项目,Netlify同样也是一个免费的网站托管平台,这次让我们来看看怎么使用Netlify来部署你的静态网站

Netlify 部署纯 HTML/CSS/JS 静态网站非常简单,永久免费、自带 CDN、自动 HTTPS,我给你完整分2 种方法(小白拖拽、Git 自动部署)从零到上线一步到位。

准备工作

一、注册 Netlify 账号

打开官网:https://www.netlify.com

右上角 Sign Up推荐用 GitHub 账号一键注册(后续 Git 部署无需额外授权),也可用邮箱注册。

登录后进入后台项目面板。

二、准备你的静态网站

我们需要准备一个,必须包含index.html首页文件的项目文件夹

准备包含index.html的项目文件

部署网站

方法 1:拖拽直传

进入 Netlify 后台主页,点击添加项目

点击添加项目

页面中间直接有 Drag and drop your site folder here 拖拽区域

Drag and drop your site folder here把你本地整个网站文件夹(不是压缩包)直接拖入网页

拖拽或手动上传项目文件

等待几秒自动部署完成,直接生成专属域名 xxx.netlify.app,点开即可访问。

点击系统分配的三级域名即可进入项目查看

方法 2:GitHub 仓库自动部署

代码存 GitHub,本地修改推送代码,Netlify 自动重新部署,最适合日常维护网站。

 

步骤 1:把代码上传到 GitHub

新建 GitHub 私有 / 公开仓库

把你的 index.html 等所有网站文件上传到仓库根目录

 

步骤 2:Netlify 关联仓库自动部署

Netlify 后台 → 点击 Add new siteImport an existing project(从 Git 导入)

点击添加项目

选择代码平台:GitHub,授权 Netlify 访问你的 GitHub 账号

在列表里选中你刚上传网站的仓库

部署配置(纯 HTML 静态站无需修改,直接默认

  • 部署分支:main(默认)
  • Build command(构建命令):留空(纯静态无需构建)
  • Publish directory(发布目录):. (代表仓库根目录,index.html 所在位置)

点击 Deploy site

等待 10 秒左右部署完成,获得 .netlify.app 免费域名,网站永久在线。

后续更新:你在 GitHub 修改、提交推送代码,Netlify自动检测并重新部署

自定义域名方法

后台网站 → Domain management Buy a domain/Add custom domain,添加及绑定你自己购买的域名,同时自动免费申请 SSL 证书(HTTPS)

添加或购买域名
上一篇 什么是成功?或许我们需要活在当下
下一篇 如何通过Vercel部署简单静态网站
2026年4月
29
30
31
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
1
2
加载中...
随便看看
1 关于我的爱好和工作
关于我的爱好和工作
2
如何通过Github部署简单静态网站
如何通过Github部署简单静态网站
3
国内外AI工具,秘塔AI与Perplexity功能测评
国内外AI工具,秘塔AI与Perplexity功能测评
4
什么是成功?或许我们需要活在当下
什么是成功?或许我们需要活在当下
5
通过宝塔面板开启网站HTTP/3的方法(Nginx教程)
通过宝塔面板开启网站HTTP/3的方法(Nginx教程)