HUGO

  • 新闻
  • 文档
  • 主题
  • 作品展示
  • 社区
  • GitHub
    • English
    • 中文

What's on this Page

  • What You’ll Need
    • Before You Begin
  • Getting Started
    • Configure Hugo to run with Nanobox
    • Installing Hugo
    • Generating a New Hugo App
    • Install a theme
    • View Your App
    • Develop, Develop, Develop
  • Deploying Hugo with Nanobox
    • Stage Your Application (optional)
    • Deploy Your Application
HOSTING AND DEPLOYMENT

使用Nanobox的主机无关部署

轻松在AWS,DigitalOcean,谷歌,Azure以及更多…部署Hugo

hugo with nanobox

Nanobox provides an entire end-to-end workflow for developing and deploying applications. Using Nanobox to deploy also means you’ll use it to develop your application.

If you’re already using Nanobox and just need deployment instructions, you can skip to Deploying Hugo with Nanobox

What You’ll Need

With Nanobox you don’t need to worry about having Go or Hugo installed. They’ll be installed as part of the development environment created for you.

To get started you’ll just need the following three items:

  • A Nanobox Account - Signup is free
  • Nanobox Desktop - The free desktop development tool
  • An account with a hosting provider such as:
    • AWS
    • Google
    • Azure
    • DigitalOcean
    • Linode
    • More…
    • Roll Your Own

Before You Begin

There are a few things to get out of the way before diving into the guide. To deploy, you’ll need to make sure you have connected a host account to your Nanobox account, and launched a new application.

Connect a Host Account

Nanobox lets you choose where to host your application (AWS, DigitalOcean, Google, Azure, etc.). In the Hosting Accounts section of your Nanobox dashboard link your Nanobox account with your host.

Launch a New Application on Nanobox

Launching a new app on Nanobox is very simple. Navigate to Launch New App in the dashboard, and follow the steps there. You’ll be asked to name your app, and to select a host and region.

With those out of the way you’re ready to get started!

Getting Started

If you already have a functioning Hugo app, you can skip to Configure Hugo to run with Nanobox

To get started, all you’ll need is an empty project directory. Create a directory wherever you want your application to live and cd into it:

mkdir path/to/project && cd path/to/project

Configure Hugo to run with Nanobox

Nanobox uses a simple config file known as a boxfile.yml to describe your application’s infrastructure. In the root of your project add the following boxfile.yml:

boxfile.yml

run.config:

  # use the static engine
  engine: static
  engine.config:

    # tell the engine where to serve static assets from
    rel_dir: public

  # enable file watching for live reload
  fs_watch: true

  # install hugo
  extra_steps:
    - bash ./install.sh

deploy.config:

  # generate site on deploy
  extra_steps:
    - hugo

If you already have a functioning Hugo app, after adding the boxfile, you can skip to Deploying Hugo with Nanobox.

Installing Hugo

Nanobox uses Docker to create instant, isolated, development environments. Because of this, you’ll need to make sure that during development you have Hugo available.

Do this by adding a custom install script at the root of your project that will install Hugo automatically for you:

install.sh


#!/bin/bash

if [[ ! -f /data/bin/hugo ]]; then
  cd /tmp
  wget https://github.com/gohugoio/hugo/releases/download/v0.31.1/hugo_0.31.1_Linux-64bit.tar.gz
  tar -xzf hugo_0.31.1_Linux-64bit.tar.gz
  mv hugo /data/bin/hugo
  cd -
  rm -rf /tmp/*
fi

If the install script fails during nanobox run you may need to make it executable with chmod +x install.sh

Make sure to check the version of Hugo you have installed and update the install script to match.

Generating a New Hugo App

You’ll generate your new application from inside the Nanobox VM (this is why you don’t need to worry about having Go or Hugo installed).

Run the following command to drop into a Nanobox console (inside the VM) where your codebase is mounted:

nanobox run

nanobox run

Once inside the console use the following steps to create a new Hugo application:

# cd into the /tmp dir to create an app
cd /tmp

# generate the hugo app
hugo new site app

# cd back into the /app dir
cd -

# copy the generated app into the project
shopt -s dotglob
cp -a /tmp/app/* .

Install a theme

cd into the themes directory and clone the nanobox-hugo-theme repo:

cd themes
git clone https://github.com/sdomino/nanobox-hugo-theme

To use the theme either copy the entire config.toml that comes with the theme, or just add the theme to your existing config.toml

# copy the config.toml that comes with the theme
cp ./themes/nanobox-hugo-theme/config.toml config.toml

# or, add it to your existing config.toml
theme = "nanobox-hugo-theme"

It is not intended that you use the nanobox-hugo-theme as your actual theme. It’s simply a theme to start with and should be replaced.

View Your App

To view your application simply run the following command from a Nanobox console:

hugo server --bind="0.0.0.0" --baseUrl=$APP_IP

hugo server

With that you should be able to visit your app at the given IP:1313 address

You can add a custom DNS alias to make it easier to access your app. Run nanobox dns add local hugo.dev. After starting your server, visit your app at hugo.dev:1313

Develop, Develop, Develop

IMPORTANT: One issue we are aware of, and actively investigating, is livereload. Currently, livereload does not work when developing Hugo applications with Nanobox.

With Hugo installed you’re ready to go. Develop Hugo like you would normally (using all the generators, etc.). Once your app is ready to deploy, run hugo to generate your static assets and get ready to deploy!

Deploying Hugo with Nanobox

If you haven’t already, make sure to connect a hosting account to your Nanobox account, and launch a new application in the Dashboard.

To deploy your application to Nanobox you simply need to link your local codebase to an application you’ve created on Nanobox. That is done with the following command:

nanobox remote add <your-app-name>

You may be prompted to login using your Nanobox credentials at this time

Stage Your Application (optional)

Nanobox gives you the ability to simulate your production environment locally. While staging is optional it’s always recommended, so there’s no reason not to!

To stage your app simply run:

nanobox deploy dry-run

Now visit your application with the IP address provided.

nanobox deploy dry-run

Deploy Your Application

Once everything checks out and you’re ready to deploy, simply run:

nanobox deploy

Within minutes you’re Hugo app will be deployed to your host and humming along smoothly. That’s it!

See Also

  • Hugo 部署
  • KeyCDN托管
  • Bitbucket托管
  • Netlify托管
  • Render托管
  • 关于 Hugo
    • 概述
    • Hugo的安全模型
    • Hugo and GDPR
    • 什么是Hugo
    • Hugo 特征
    • 静态的好处
    • 证书
  • 入门
    • 入门概述
    • 快速开始
    • 安装 Hugo
    • 基本用法
    • 目录结构
    • 配置
    • 外部学习资源
  • Hugo 模块
    • Hugo 模块概述
    • 配置模块
    • 使用Hugo模块
    • 主题组件
  • 内容管理
    • 内容管理概述
    • 组织
    • 捆绑页
    • 内容格式
    • 前面的问题
    • 构建选项
    • 网页资源
    • 图像处理
    • 简码
    • 相关内容
    • 章节
    • 内容类型
    • 原型
    • 分类
    • 摘要
    • 链接和交叉引用
    • URL管理
    • 菜单
    • 目录
    • 静态文件
    • 注释
    • 多种语言 和 国际化
    • 语法高亮
  • 模板
    • 模板概述
    • 介绍
    • 模板查找顺序
    • 自定义输出格式
    • 基本模板和模块
    • 列表页面模板
    • 首页模板
    • 章节模板
    • 分类模板
    • 单页模板
    • 内容视图模板
    • 数据模板
    • 部件模板
    • 简码模板
    • 本地文件模板
    • 404页
    • 菜单模板
    • 分页
    • RSS 模板
    • 网站地图模板
    • Robots.txt
    • 内置模板
    • 另类模板
    • 模板调试
  • 函数
    • 函数快速参考
    • .AddDate
    • .Format
    • .Get
    • .GetPage
    • .HasMenuCurrent
    • .IsMenuCurrent
    • .Param
    • .Render
    • .RenderString
    • .Scratch
    • .Unix
    • absLangURL
    • absURL
    • after
    • anchorize
    • append
    • apply
    • base64
    • chomp
    • complement
    • cond
    • countrunes
    • countwords
    • dateFormat
    • default
    • delimit
    • dict
    • echoParam
    • emojify
    • eq
    • errorf and warnf
    • fileExists
    • findRE
    • first
    • float
    • ge
    • getenv
    • group
    • gt
    • hasPrefix
    • highlight
    • htmlEscape
    • htmlUnescape
    • hugo
    • humanize
    • i18n
    • in
    • index
    • int
    • intersect
    • isset
    • jsonify
    • lang.Merge
    • lang.NumFmt
    • last
    • le
    • lower
    • lt
    • markdownify
    • Math
    • md5
    • merge
    • ne
    • now
    • os.Stat
    • partialCached
    • path.Base
    • path.Dir
    • path.Ext
    • path.Join
    • path.Split
    • plainify
    • pluralize
    • print
    • printf
    • println
    • querify
    • range
    • readDir
    • readFile
    • ref
    • reflect.IsMap
    • reflect.IsSlice
    • relLangURL
    • relref
    • relURL
    • replace
    • replaceRE
    • safeCSS
    • safeHTML
    • safeHTMLAttr
    • safeJS
    • safeURL
    • seq
    • sha
    • shuffle
    • singularize
    • slice
    • slicestr
    • sort
    • split
    • string
    • strings.HasSuffix
    • strings.Repeat
    • strings.RuneCount
    • strings.TrimLeft
    • strings.TrimPrefix
    • strings.TrimRight
    • strings.TrimSuffix
    • substr
    • symdiff
    • templates.Exists
    • time
    • title
    • transform.Unmarshal
    • trim
    • truncate
    • union
    • uniq
    • upper
    • urlize
    • urls.Parse
    • where
    • with
    • 图片函数
  • 变量
    • 变量概述
    • 网站变量
    • 简码变量
    • 页面变量
    • 页面方法
    • 分类变量
    • 文件变量
    • 菜单项属性
    • Hugo 变量
    • Git的变量
    • 网站地图变量
  • Hugo 管道
    • Hugo 管道概述
    • Hugo 管道简介
    • SASS / SCSS
    • PostCSS
    • 资产压缩
    • Asset 捆绑
    • 指纹和SRI
    • 来自模板资源
    • 从字符串资源
  • CLI
  • 故障排除
    • 疑难解答
    • FAQ
    • 构建性能
  • 工具
    • 开发工具概述
    • 迁移
    • 入门套件
    • 前端
    • 编辑器插件
    • 搜索
    • 其他的项目
  • 托管和部署
    • 托管和部署概述
    • Hugo 部署
    • 使用Nanobox的主机无关部署
    • AWS Amplify托管
    • Netlify托管
    • Render托管
    • Firebase托管
    • GitHub托管
    • GitLab托管
    • KeyCDN托管
    • Bitbucket托管
    • 使用Wercker部署
    • 使用rsync部署
  • 贡献
    • 贡献Hugo
    • 开发
    • 文档
    • 主题
  • 保养
“使用Nanobox的主机无关部署” was last updated: March 24, 2020: 翻译 (91f26d0)
Improve this page
By the Hugo Authors
Hugo Logo
  • File an Issue
  • Get Help
  • Discuss Source Code
  • @GoHugoIO
  • @spf13
  • @bepsays

Netlify badge

 
 

Hugo Sponsors

Logo for Forestry.io
Logo for Linode
Logo for eSolia
 

The Hugo logos are copyright © Steve Francia 2013–2020.

The Hugo Gopher is based on an original work by Renée French.

  • 新闻
  • 文档
  • 主题
  • 作品展示
  • 社区
  • GitHub
  • 关于 Hugo
  • 入门
  • Hugo 模块
  • 内容管理
  • 模板
  • 函数
  • 变量
  • Hugo 管道
  • CLI
  • 故障排除
  • 工具
  • 托管和部署
  • 贡献
  • 保养