跳到主要内容

静态站点部署(netlify)

· 阅读需 3 分钟

用到了好的静态站点部署工具,值得分享一下。

访问地址:https://www.netlify.com/(界面是英文的,但是用起来很简单,翻译一下就很容易理解)

优点

  • 支持git持续部署(当每次提交代码,它会自动执行部署程序),仅支持GitHub、GitLab、Bitbucket、Azure DevOps。

  • 手动部署(上传打包文件)

提前准备

准备好已经打包好的静态网站文件夹。dist

域名

注册账号

注册、登录不说了。用邮箱注册,随便填一填账号注册信息就行。

注册站点(部署)

注册成功后,下一步注册站点。

点击右侧Add new site,我选择手动部署

直接把打包后的文件拖到中间的文件夹区域

然后他会跳转到网站管理页面

点击左侧导航Site overview,能看到访问链接,类似https://golden-pavlova-****.netlify.app,这就是他提供的访问链接,我们下一步配置使用自己的域名来访问该站点。

配置自己的域名

点击左侧导航Domain management,点击Add a domain,添加自己的域名,输入要添加的域名:test.XXX.cn,点击验证,然后弹出结果,再点击Add subdomain就行了。

下一步,配置域名的访问指向,去域名服务商修改解析。(按图操作,根据弹出框提示配置CNAME)

配置完可以尝试访问域名(上个图中的按钮也会消失,访问不通可能需要等一段时间,基本几分钟也就差不多了)

配置Https

我们在域名服务商那申请个ssl证书,申请好下载下来(nginx通用的那个),默认你里面有4个文件(pem、crt、key、csr)

下边找到Https的配置,点击Provide your own certificate,使用自己上传的证书。

PS

我配置好域名,从免费SSL申请下证书,网页不用我配置像图中那样手动配置,挺好,这样续期就直接从域名服务商那申请新的就行了。

更新内容

最后,介绍更新。git部署不用手动操作了,我就说一下手动部署,在左侧Deploys菜单中,把新的部署文件夹上传到页面,