0%

如何将代码部署到 Netlify 上(私人项目)

准备工作

  1. 我们需要一个通过 Deploy manually 部署的项目的 Site IDhttps://imgur.com/a/WJqD92t
  2. 需要一个 Netlify 上的 Personal access tokens

    关于如何获取这俩东西,不是本文所关心的,你可以自己上网查,很简单,点击下就 ok

Github action 自动部署

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
31
32
33
# .github/workflows/netlify.yml
name: Build and Deploy to Netlify
on:
push:
branches: [ main ]
pull_request:
branches: [ main ]

jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v2
with:
node-version: 16
registry-url: 'https://registry.npmjs.org'
# 安装依赖
- run: npm install
# 打包
- run: npm run build

# 部署
- name: Deploy to netlify
uses: netlify/actions/cli@master
with:
# 这里指定下需要部署的目录
args: deploy --dir=dist --prod
env:
# 在 secrets/actions 中配置的 Site ID
NETLIFY_SITE_ID: ${{ secrets.NETLIFY_SITE_ID }}
# 在 secrets/actions 中配置的 Personal access tokens
NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}

手动部署

手动部署,我们需要使用 netlify-cli 这个包

1
$ yarn add netlify-cli -D

创建一个文件,用于处理手动部署

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
# deploy.ts
/**
* 处理部署 Hook_injection.js
*/
import { spawn } from "child_process";

// prettier-ignore
const output = spawn("npx", [
"netlify",
"deploy",
"--dir", "需要部署的 folder 路径",
"--site", "你的 Site ID",
"--auth", "你的 Personal access tokens",
"--prod"
]);

output.stdout.on("data", function (data) {
console.log("stdout: " + data.toString());
});

output.stderr.on("data", function (data) {
console.log("stderr: " + data.toString());
});

output.on("exit", function (code) {
// @ts-ignore
console.log("child process exited with code " + code.toString());
});

手动执行下即可 esno deploy.ts