• Cuenta DigitalOcean

Crear archivo Docker

Cree Dockerfile en la raíz de su sitio.

Nuestro plantilla inicial ya incluye el Dockerfile.

 1###############
 2# Build Stage #
 3###############
 4FROM hugomods/hugo:exts as builder
 5
 6COPY . /src
 7
 8ENV HUGO_ENV=production
 9
10# Base URL
11ARG HUGO_BASEURL=
12ENV HUGO_BASEURL=${HUGO_BASEURL}
13
14# Module Proxy
15ARG HUGO_MODULE_PROXY=
16ENV HUGO_MODULE_PROXY=${HUGO_MODULE_PROXY}
17
18# NPM mirrors, such as https://registry.npmmirror.com
19ARG NPM_CONFIG_REGISTRY=
20ENV NPM_CONFIG_REGISTRY=${NPM_CONFIG_REGISTRY}
21
22# Install dependencies
23RUN npm ci
24
25# Build site
26RUN hugo --minify --gc --enableGitInfo
27
28# Set the fallback 404 page if defaultContentLanguageInSubdir is enabled, please replace the `en` with your default language code.
29# RUN cp ./public/en/404.html ./public/404.html
30
31###############
32# Final Stage #
33###############
34FROM hugomods/hugo:nginx
35COPY --from=builder /src/public /site

• /site es el directorio de salida de archivos estáticos, que se utilizará más adelante.

Crear aplicación

Navegue hasta DigitalOcean Dashboard -> Panel izquierdo -> Apps -> Crear aplicación y luego complete el formulario de la siguiente manera.

Flujo de trabajo

Cree .gitlab-ci.yml en la raíz de su sitio con el siguiente contenido:

 1image: registry.gitlab.com/pages/hugo/hugo_extended:latest
 2
 3variables:
 4  HUGO_ENV: production
 5
 6default:
 7  before_script:
 8    - apk add --update --no-cache git go npm
 9    - npm install
10
11test:
12  script:
13    - hugo --gc --minify
14  rules:
15    - if: $CI_COMMIT_REF_NAME != $CI_DEFAULT_BRANCH
16
17pages:
18  script:
19    - hugo --gc --minify
20  artifacts:
21    paths:
22      - public
23  rules:
24    - if: $CI_COMMIT_REF_NAME == $CI_DEFAULT_BRANCH

El ejemplo anterior solo implementará la rama predeterminada en GitLab Pages y ejecutará una prueba en el resto de las ramas.

Herramientas de construcción

Como mencionó Requisitos previos, deberá configurar esas herramientas en su entorno de implementación.

Instalación de dependencias

Usamos NPM para administrar las dependencias del tema, es necesario instalar las dependencias en el entorno de implementación, ya que NO DEBEMOS confirmar la carpeta node_modules.

Principio

1. Utilice Hugo para crear el sitio y generar archivos estáticos.
2. Utilice Nginx como servidor para manejar solicitudes.

Archivo Docker

Cree un Dockerfile en la raíz del sitio.

 1###############
 2# Build Stage #
 3###############
 4FROM razonyang/hugo as builder
 5
 6WORKDIR /src
 7COPY . /src
 8
 9ARG HUGO_ENV=production
10ENV HUGO_ENV=${HUGO_ENV}
11
12# Base URL
13ARG HUGO_BASEURL=/
14ENV HUGO_BASEURL=${HUGO_BASEURL}
15
16# Module Proxy
17ARG HUGO_MODULE_PROXY=
18ENV HUGO_MODULE_PROXY=${HUGO_MODULE_PROXY}
19
20# NPM mirrors, such as https://registry.npmmirror.com
21ARG NPM_CONFIG_REGISTRY=
22ENV NPM_CONFIG_REGISTRY=${NPM_CONFIG_REGISTRY}
23
24# Install dependencies
25RUN npm install
26RUN npm install -g @fullhuman/postcss-purgecss rtlcss
27
28# Build site
29RUN hugo --minify --gc --enableGitInfo
30
31# Set the fallback 404 page if defaultContentLanguageInSubdir is enabled, please replace the `en` with your default language code.
32# RUN cp ./public/en/404.html ./public/404.html
33
34###############
35# Final Stage #
36###############
37FROM nginx
38COPY --from=builder /src/public /app
39COPY deploy/nginx/default.conf /etc/nginx/conf.d/default.conf

• Hay dos etapas para la construcción, una etapa de construcción y una etapa de lanzamiento. La etapa de lanzamiento contiene solo los archivos estáticos generados, manteniendo el tamaño de la imagen de Docker lo más pequeño posible.
• Si tiene defaultContentLanguageInSubdir habilitado, descomente y modifíquelo a pedido.
• El parámetro HUGO_BASEURL se usa para especificar el baseURL del sitio durante la compilación y generalmente se usa cuando baseURL es diferente de la configuración, por lo que puede eliminarlo usted mismo si no lo necesita.
• HUGO_MODULE_PROXY y NPM_CONFIG_REGISTRY son parámetros de compilación opcionales que se pueden eliminar si no son necesarios.

Nginx

Cree un deploy/nginx/default.conf en la raíz del sitio:

Flujo de trabajo

Cree .github/workflows/gh-pages.yml en la raíz del sitio.

 1name: GitHub Pages
 2on:
 3  push:
 4    branches:
 5      - main
 6permissions:
 7  contents: write
 8jobs:
 9  build-and-deploy:
10    concurrency: ci-${{ github.ref }}
11    runs-on: ubuntu-latest
12    steps:
13      - name: Checkout 🛎️
14        uses: actions/checkout@v3
15        with:
16          submodules: true
17          fetch-depth: 0
18
19      - name: Setup Node
20        uses: actions/setup-node@v3
21        with:
22          node-version: '16'
23
24      - name: Cache dependencies
25        uses: actions/cache@v2
26        with:
27          path: ~/.npm
28          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
29          restore-keys: |
30            ${{ runner.os }}-node-            
31
32      - name: Install dependencies
33        run: npm install
34
35      - name: Setup Hugo
36        uses: peaceiris/actions-hugo@v2
37        with:
38          hugo-version: 'latest'
39          extended: true
40
41      - name: Build
42        run: hugo --minify --gc --enableGitInfo
43
44      - name: Deploy 🚀
45        uses: peaceiris/actions-gh-pages@v3
46        with:
47          github_token: ${{ secrets.GITHUB_TOKEN }}
48          publish_dir: ./public

Ver también Flujo de trabajo de páginas de GitHub de plantilla inicial。

]]>https://vandenboom.online/es/docs/deployment/cloudflare-pages/Tue, 12 Jul 2022 20:06:24 +0800https://vandenboom.online/es/docs/deployment/cloudflare-pages/Este artículo le muestra cómo implementar su sitio en Páginas de Cloudflare.

Creando un proyecto

Comenzaremos creando un proyecto Git y completando la información adecuada.

Comando de compilación

1npm i && hugo --gc --minify --enableGitInfo -b https://hbs-skeleton.pages.dev

1. npm i es un acceso directo a npm install, que instala las dependencias utilizadas durante la construcción del sitio.
2. -b https://hbs-skeleton.pages.dev especifica baseURL, reemplácelo usted mismo. También puede guardarlo en un archivo de configuración en lugar de especificarlo en el comando de compilación.

Variables de entorno

Nombre	Valor
HUGO_VERSION	0.147.9
NODE_VERSION	16

Página 404

Cloudflare es lo suficientemente inteligente como para utilizar las páginas 404 que mejor coinciden, incluso para sitios multilingües, y funciona sin configuraciones adicionales.

]]>https://vandenboom.online/es/docs/deployment/netlify/Tue, 12 Jul 2022 14:20:49 +0800https://vandenboom.online/es/docs/deployment/netlify/Este artículo muestra cómo implementar su sitio en Netlificar.

Configuración de Netlify

Cree un netlify.toml en la raíz del sitio:

 1[build]
 2  publish = "public"
 3
 4[build.environment]
 5  NODE_VERSION = "17.6.0"
 6  HUGO_VERSION = "0.147.9"
 7  HUGO_ENABLEGITINFO = "true"
 8  GO_VERSION = "1.17.7"
 9
10[context.production]
11  command = "npm install && hugo --minify"
12
13[context.production.environment]
14  HUGO_ENV = "production"
15
16[[headers]]
17  for = "/*"
18  [headers.values]
19    Referrer-Policy = "strict-origin-when-cross-origin"
20    X-Content-Type-Options = "nosniff"
21    X-Frame-Options = "deny"
22    X-XSS-Protection = "1; mode=block"
23
24[[redirects]]
25  from = "/:lang/*"
26  to = "/:lang/404.html"
27  status = 404
28
29[[redirects]]
30  from = "/*"
31  to = "/en/404.html" # Replace the "en" to your default language code if "defaultContentLanguageInSubdir" is enabled, otherwise use "/404.html" instead.
32  status = 404

Véase también Configuración de Netlify de plantilla inicial.

]]>