前，我写过一个“WordPress的静态化方法”，使用的是一个名为cos-html-cache的插件实现。

这个插件非常简洁小巧，直接在原网站上生成首页和文章页的html文件，不过，这个插件只支持文章静态化，不支持页面、标签和分类的静态化，之后也再没有过更新。

后来，我想到过利用WordPress插件导出全静态化网站的方法，用这个方法，对于少量文章挺方便，但文章数量一旦多了，就经常出错。

后来，我看到有人在cos-html-cache插件的基础上又开发了一个插件，名叫Super Static Cache，我用了一下，发现其BUG较多，但Rewrite模式是可以正常使用的，在这个模式下，可以将首页、文章页、单页、分类页、Tag页都生成静态化文件，并保存在一个名为super-static-cache的目录下，直接复制这个目录即可得到一个静态化网站。

因此，一个更简单的生成静态化网站的方法来了，先在网站安装Super Static Cache，之后运行一个抓取网站的工具，这类工具很多，例如wget、sitemaps生成器之类的，把整个网站抓一遍（wget还能多生成一份），即可在super-static-cache的目录获取到网站的静态化Html文件。

wget在Windows、Linux、Mac都有，用wget下载网站的命令是：

wget -m 网站地址

里云云开发平台重磅推出开源应用中心，聚合最热门的开源应用，让你像安装app一样快速上线一个网站。面向新人和持续活跃的开发者用户推出上线激励加油包，最高100元无门槛代金券免费送，现在体验还能够领取年轻人的养生神器，桌面不锈钢保温杯！

聚合最热门的开源应用

开源应用中心聚合了目前最热门的前端开源应用模版，让大家真正可以做到像安装APP一样来上线一个网站。目前已经支持最热门的前端框架，包括Vue.js、React、Nuxt.js、Next.js、AntDesign等，还有内容管理平台Hexo、Docusaurus、VuePress、Sapper等。使用部署开源模版非常适合您的以下场景：

• 个人学习：轻松创建个人主页、博客等网站，边部署边学习。
• 协同开发：创建信息管理系统、CMS等前端项目，多人协同维护开发。

云开发平台同样面向广大的开源作者征集应用，对于热门的应用我们能够提供现金激励、以及流量曝光等扶持。

开源应用一键同步一键部署

阿里云云开发平台前端应用部署功能旨在为前端开发者改善工作环境，优化前端开发和部署体验。同时还可以结合云开发平台云原生的架构能力和主机应用的部署能力，让前后端应用能够更高效地协同。

• 操作简单：无需购买服务器、配环境、手动上传文件等，云开发平台都可以帮你自动操作，包括在需要时随时一键上线/下线。
• 使用零成本: 支持GitHub和云效的Codeup仓库，快速将仓库的代码进行构建部署。
• 免费资源扶持: 免费提供临时的测试域名，对于新用户和持续活跃的用户提供免费的云资源加油包。
• 无数量限制: 没有使用的repo数量和应用数量的限制, 不管是开源仓库还是自己账户下的repo，每一个代码repo都可以部署为一个静态网站。

简单几步使用云开发平台上线静态应用

1. 账号准备工作

• 你需要一个阿里云账号，并使用阿里云账号登录云开发平台 (https://workbench.aliyun.com/)，按照提示创建团队，点击同意协议。没有阿里云账号就在登录页面注册一个继续登录。
• 拥有Github账号 (https://github.com/)，没有就注册一个。为保证最好的使用体验，请使用Chrome浏览器。
• 未开通阿里云OSS的用户，点击链接 (https://workbench.aliyun.com/product/open?code=oss)开通OSS服务。OSS开通免费，有一定的免费额度，超过额度之后按量付费。

2. 创建应用

2.1 选择应用中心任意模版创建应用

• 选择应用中心任意模版创建应用。如果您之前没有使用过云开发平台，会出现云资源授权管理的选项，往下拉出现直至同意授权的字样，点击「同意授权」后出现授权成功，点击进入「下一步」。

• 绑定GitHub账号。授权完成后选择来源仓库为GitHub，按照提示点击去绑定，绑定GitHub帐号，登录后并点击Authorize AliyunWorkbench允许云开发平台构建、发布你的GitHub代码为可访问的网站。 绑定完成后返回应用创建页面，代码仓库按照默认「模板仓库」以及默认主干分支不用操作，并点击「下一步」。

• 填写应用信息完成创建。填写必要的的应用信息完成创建（我们已提供默认配置），成功后进入到应用详情和部署界面。首次登录并没有可选所属生产线，点击右侧自动创建产品线即可。

2.2 使用自己的仓库应用创建

• 选择自己仓库里需要部署的应用。除了可以使用应用中心的模版创建网站，云开发平台也支持使用本地代码或者开源代码创建静态网站。与通过模版中心的应用创建的区别在于，在绑定Gihutb之后选择“自己的仓库”，找到上一步自己创建的GitHub仓库及master分支。然后在应用详情页面根据以上的步骤继续填写即可。

• 设定部署配置。当部署的是您自己的代码仓库时，开发平台需要您根据具体代码进行简单配置来部署成功：

1. 编写build.sh：代码从源码，经过npm打包编译等过程，到生成为纯粹HTML/CSS/JS静态文件的全过程的shell指令，需要被完整填写到发布分支根路径下的build.sh文件中，例如：

不知道如何操作？您也可直接点击一次“部署”按钮，之后，对默认生成的build.sh内容进行任意修改：

b. 填写静态文件相对目录：在build.sh执行后，从代码生成出的静态文件所在的相对目录，需要被填写到“部署配置-资源路径”中。

Tip：例如React应用（如图），一般会填写“./build”；Vue应用则一般为“./dist”。

c. 调整配置：当您完成上述步骤后，发现自己的代码仍然部署错误时，需查看排查部署日志，对上面的build.sh和部署资源路径进行修改。常见的几种部署错误情况如下：

3. 在日常环境部署站点

• 一键进行应用部署。在应用详情页面点击日常环境的「部署」按钮进行一键部署，部署状态变成绿色已部署以后可以点击访问部署网站查看效果。

• Dinosaurs网站日常环境部署好了。日常环境的测试域名也是可以访问的，点击访问已部署网站按钮会出现一个弹出，点击弹出上的立即访问就能够访问已经部署好的站点了。在部署完成后，可以继续本地编码，并将代码push到应用的“基本信息”中对应的代码仓库内。

4. 配置自定义域名在线上环境上线

• 配置线上环境自定义域名。在功能开发验证完成后要在线上环境进行部署，在线上环境的「部署配置」-「自定义域名」中填写自己的域名。例如我们添加一个二级域名 company.workbench.fun 来绑定我们部署的前端应用。然后复制自定义域名下方的API网关地址对添加的二级域名进行CNAME配置。

• 配置CNAME地址。复制好 API网关域名地址后，来到你自己的域名管理平台（此示例中的域名管理是阿里云的域名管理控制台，请去自己的域名控制台操作）。添加记录的「记录类型」选择「CNAME」，在「主机记录」中输入你要创建的二级域名，这里我们输入「company」，在「记录值」中粘贴我们之前复制的 API网关域名地址，「TTL」保留默认值或者设置一个你认为合适的值即可。

• 在线上环境部署上线。回到云开发平台的应用详情页面，按照部署的操作，点击线上环境的「部署按钮」，部署完成以后就在你自定义的域名进行了上线。CNAME 生效之后，我们输入 company.workbench.fun（示例网址） 可以打开部署的页面。至此，如何部署一个应用到线上环境，如何绑定自己的域名来访问一个线上的应用就完成了，赶紧部署自己的应用到线上环境，用自己的域名玩起来吧 ；）

原文链接：https://developer.aliyun.com/article/829641?utm_content=g_1000314028

本文为阿里云原创内容，未经允许不得转载。

态网页也叫做平面页，是一种简单的网页形式，它的内容在网页创建时就已经被确定，就像是一本已经印刷好的纸张。无论你何时打开这页纸，内容都是一样的。这种网页通常使用HTML编写，可能包含CSS和JavaScript，但不包含像PHP、ASP.net等服务端的动态脚本。包含文本、图像、声音、Flash动画、客户端脚本和ActiveX控件及JAVA小程序等。

静态网页没有后台数据库、没有可交互的网页。做好并上传到服务器上，就不能对网站的内容进行修改，除非把网站文件下载到自己计算机上，再用专业的网站制作软件编辑好上传（修改源代码）。

静态网页不能简单地理解成静止不动的网页，主要指的是网页中没有程序代码，只有HTML，网页URL以.htm、.html、xml等常见形式为后缀。

静态网页也包括一些能动的部分，静态网页上展示的内容并非完全静止的，它也可以有各种视觉上的动态效果，如GIF动图、Flash动画、滚动字幕等。

静态网页优点：

1、静态网页的内容相对稳定，比较安全，数据不会丢失；

2、静态网页的结构清晰，方便搜索引擎爬虫抓取和理解，因此对搜索引擎优化（SEO）更友好；

3、维护简单：静态网页通常比动态网页更容易维护；

4、静态网页被访问的速度快，访问过程中无须连接数据库，开启页面速度快于动态页面。

5、减轻了服务器的负担，工作量减少，也就降低了数据库的成本。

6、静态页面非常适合用于展示固定内容的网站，如企业官方网站、产品介绍页、博客文章等。

静态网页缺点：

没有数据库的支持，不能直接对网站内容进行修改，更新维护比较麻烦，得修改源代码，才能改变网页内容；

静态网页的交互性较差，在功能方面有较大的限制。实现不了会员注册、在线留言、购买交易等功能，只能简单地展示信息；

静态网页的优点包括加载速度快，安全性高，容易维护和优化，适合SEO。然而，对于需要频繁更新或者具有大量用户交互的网站，静态网页可能不是最佳选择。当需要对整个网站的静态页面进行批量的修改时，工作量有可能会比较大。