如何使用 Wintersmith + Serverless Framework 快速創建個人站點

如何使用 Wintersmith + Serverless Framework 快速創建個人站點，相信很多沒有經驗的人對此束手無策，為此本文總結了問題出現的原因和解決方法，通過這篇文章希望你能解決這個問題。

首先我們來介紹下，Wintersmith 是一個簡單而靈活的靜態站點生成器。采用 markdown 構建，這個是我們的基礎條件。

• Serverless Framework：在 GitHub 上有三萬顆星，業界非常受歡迎的無服務器應用框架，開發者無需關心底層資源即可部署完整可用的 Serverless 應用架構。

確保系統包含以下環境：

• Node.js (Node.js 版本需不低于 8.6，建議使用 10.0 及以上版本)

1. 安裝 Serverless Framework

$ npm install -g serverless

2. 安裝 wintersmith

$ npm i wintersmith -g

3. 新建 wintersmith 項目

可對指定路徑進行安裝

$ wintersmith new <path>

初始化成功后，可以看到路徑下創建的項目文件

4. 本地預覽

運行以下命令，并通過瀏覽器訪問 http://localhost:8080 即可方便地預覽效果，而且提供 LiveReload 功能，可以實時預覽。

$ wintersmith preview

使用如下命令構建網站：

$ wintersmith build

5. 配置 yml 文件

在項目目錄下，創建 serverless.yml 文件：

$ touch serverless.yml

將以下內容寫入上述的 yml 文件里：

# serverless.yml

myWebsite:
 component: '@serverless/tencent-website'
 inputs:
 code:
 src: ./build
 index: index.html
 error: index.html
 region: ap-guangzhou
 bucketName: my-bucket

配置完成后，文件目錄如下：

.
├── build
| ├── index.html
| └── README.md
└── serverless.yml

6. 部署

通過 sls 命令進行部署，這里還可以添加 –debug 參數來查看部署過程中的信息：

$ sls --debug

如您的賬號未登陸或注冊騰訊云，您可以直接通過微信掃描命令行中的二維碼進行授權登陸和注冊，從而進行授權登陸和注冊。這也是我覺得特別方便的一個地方！

部署過程中，terminal 顯示信息示意：

訪問命令行輸出的 url，即可查看使用 Serverless Framework 部署的網站啦~

雖然這只是一個非常簡單的示例，但是不難看出，Serverless Framework 在快速部署方面的強大能力。比如集成了微信掃描二維碼，就直接讓我們避開了繁瑣的云服務的賬號注冊、配置的環節。而你需要做的，只是根據 Wintersmith 自身的能力，進行網站的定制。

看完上述內容，你們掌握如何使用 Wintersmith + Serverless Framework 快速創建個人站點的方法了嗎？如果還想學到更多技能或想了解更多相關內容，歡迎關注億速云行業資訊頻道，感謝各位的閱讀！