# Deploying Hugo on S3 using wercker

**URL:** <https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733>\
**Category:** support\
**Created:** [March 8, 2017, 2:28am UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733 "2017-03-08T02:28:39Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![senthil\_thyagarajan](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/senthil_thyagarajan/32/2772_2.png) [@senthil\_thyagarajan](https://discourse.gohugo.io/u/senthil_thyagarajan)\
**Post date:** [March 8, 2017, 2:28am UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/1 "2017-03-08T02:28:39Z")

</div>

I am trying to deploy a website on S3 using wercker. So I have a git repo with the config.toml and the wercker.yaml.The build goes fine on wercker with all the files I can see them on S3. When I hit the website I get an error like this for all my js ,css and img files: net::ERR\_CONNECTION\_TIMED\_OUT

the website is [www.stencilled.me](http://www.stencilled.me)

What could I be doing incorrect or need to check in.

thank you.

---

<div class="post-metadata">

**Author:** ![rdwatters](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/rdwatters/32/2848_2.png) [@rdwatters](https://discourse.gohugo.io/u/rdwatters)\
**Post date:** [March 8, 2017, 3:32am UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/2 "2017-03-08T03:32:27Z")

</div>

I’m not seeing anything in your html `<head>`, first of all, but that’s not the the issue here…

The problem is that I have no access to your S3 account, but when you check the bucket, is everything pushing to the account correctly? I believe that you can check your files from within the AWS UI?

---

<div class="post-metadata">

**Author:** ![senthil\_thyagarajan](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/senthil_thyagarajan/32/2772_2.png) [@senthil\_thyagarajan](https://discourse.gohugo.io/u/senthil_thyagarajan)\
**Post date:** [March 8, 2017, 3:35am UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/3 "2017-03-08T03:35:53Z")

</div>

I do see all the files under the bucket from the UI. I can see individual files too and its contents(js and css). Bu t it times out saying not reachable.

---

<div class="post-metadata">

**Author:** ![Jura](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/jura/32/13581_2.png) [@Jura](https://discourse.gohugo.io/u/Jura)\
**Post date:** [March 8, 2017, 11:51am UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/4 "2017-03-08T11:51:32Z")

</div>

> [@senthil\_thyagarajan](#):
>
> When I hit the website I get an error like this for all my js ,css and img files: net::ERR\_CONNECTION\_TIMED\_OUT

Perhaps this is caused by your bucket policy? If I visit your website now, I get a 403 forbidden error message. See [here](http://docs.aws.amazon.com/AmazonS3/latest/dev/WebsiteAccessPermissionsReqd.html) for the bucket policy needed for a static website hosted on S3.

---

<div class="post-metadata">

**Author:** ![senthil\_thyagarajan](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/senthil_thyagarajan/32/2772_2.png) [@senthil\_thyagarajan](https://discourse.gohugo.io/u/senthil_thyagarajan)\
**Post date:** [March 8, 2017, 4:10pm UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/5 "2017-03-08T16:10:44Z")

</div>

Currently I am not able to deploy because I get an error saying bucket not found when deploying from Wercker. Let me fix that and I shall update it here accordingly.

---

<div class="post-metadata">

**Author:** ![Jura](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/jura/32/13581_2.png) [@Jura](https://discourse.gohugo.io/u/Jura)\
**Post date:** [March 8, 2017, 4:38pm UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/6 "2017-03-08T16:38:38Z")

</div>

You’re on the good track; I can visit your webpage now without the 403 error. 🙂

I see that `main.css`, `pygments_highlights.css`, and `highlight.min.css` still trigger a 403 error. If you’re stuck, you can try to remove those files from the bucket and re-upload them. It might be that they were uploaded with the wrong access policy, since your `index.html` did succeed in uploading and being publicly accessible.

---

<div class="post-metadata">

**Author:** ![senthil\_thyagarajan](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/senthil_thyagarajan/32/2772_2.png) [@senthil\_thyagarajan](https://discourse.gohugo.io/u/senthil_thyagarajan)\
**Post date:** [March 8, 2017, 5:03pm UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/7 "2017-03-08T17:03:50Z")

</div>

The request url goes as

[http://www.stencilled.me/www.stencilled.me/css/main.css](http://www.stencilled.me/www.stencilled.me/css/main.css)

Is this how the config should be "

```
baseurl = "www.stencilled.me"
languageCode = "en-us"
title = "Stencilled"
theme = "beautifulhugo"
pygmentsUseClasses = true
pygmentCodeFences = true

```

Thank You.

---

<div class="post-metadata">

**Author:** ![Jura](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/jura/32/13581_2.png) [@Jura](https://discourse.gohugo.io/u/Jura)\
**Post date:** [March 8, 2017, 5:15pm UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/8 "2017-03-08T17:15:33Z")

</div>

I’d add `http://` in front of base url. I’ve personally never defined base url without such a prefix for my Hugo sites.

Your theme might also have information over how to configure the base url when in doubt.

---

<div class="post-metadata">

**Author:** ![senthil\_thyagarajan](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/senthil_thyagarajan/32/2772_2.png) [@senthil\_thyagarajan](https://discourse.gohugo.io/u/senthil_thyagarajan)\
**Post date:** [March 8, 2017, 5:18pm UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/9 "2017-03-08T17:18:00Z")

</div>

Thanks . I shall try that . I just checked the bucket for index.html and if you check this one it picks up the theme as well

[https://s3.amazonaws.com/www.stencilled.me/index.html](https://s3.amazonaws.com/www.stencilled.me/index.html)

---

<div class="post-metadata">

**Author:** ![senthil\_thyagarajan](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/senthil_thyagarajan/32/2772_2.png) [@senthil\_thyagarajan](https://discourse.gohugo.io/u/senthil_thyagarajan)\
**Post date:** [March 8, 2017, 7:23pm UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/10 "2017-03-08T19:23:34Z")

</div>

@Jura This is how the folder structure looks like inside s3 bucket:

![](https://canada1.discourse-cdn.com/flex036/uploads/gohugo/original/2X/b/b01b315f640b164c05d21b87c747ba95698231dd.PNG)

---

<div class="post-metadata">

**Author:** ![Jura](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/jura/32/13581_2.png) [@Jura](https://discourse.gohugo.io/u/Jura)\
**Post date:** [March 9, 2017, 6:29am UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/11 "2017-03-09T06:29:55Z")

</div>

Not sure if we’re on the same page here. The base url that I mentioned in my previous post doesn’t have to do with how your folders and files are structured. Instead, the base url is simply the root address of your website ([http://www.example.com](http://www.example.com)) and sort of the entry point of your folder structure.

Or do you want me to show something else with your screenshot? From my standpoint, it looks okay and comparable to my S3 buckets. (`firstpost` is a bit of an odd folder though, but if that’s something you want, then Hugo is flexible enough to do that.)

---

<div class="post-metadata">

**Author:** ![senthil\_thyagarajan](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/senthil_thyagarajan/32/2772_2.png) [@senthil\_thyagarajan](https://discourse.gohugo.io/u/senthil_thyagarajan)\
**Post date:** [March 9, 2017, 6:45am UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/12 "2017-03-09T06:45:16Z")

</div>

Sorry if I went off track. This is what I have done so far.i have the config and wercker yaml at [https://github.com/senthilthyagarajan/stencilled.me](https://github.com/senthilthyagarajan/stencilled.me) . After the deployment whem I see the website [http://www.stencilled.me/](http://www.stencilled.me/) it doesnt seem to pick the css files as they throw up 404 error.But when I see the index.html file it seems to be correctly showing with the theme [https://s3.amazonaws.com/www.stencilled.me/index.html](https://s3.amazonaws.com/www.stencilled.me/index.html) .Both of these however have wrong redirects for other pages in them . I follwed this tutorial : [http://doc.lijun.li/web-hugo-aws-s3-wercker.html](http://doc.lijun.li/web-hugo-aws-s3-wercker.html) .

---

<div class="post-metadata">

**Author:** ![Jura](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/jura/32/13581_2.png) [@Jura](https://discourse.gohugo.io/u/Jura)\
**Post date:** [March 9, 2017, 6:54am UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/13 "2017-03-09T06:54:29Z")

</div>

What seems to be missing from that tutorial is configuring the S3 buckets: the tutorial you link only discusses creating a user and IAM policy. While important, I also think you’ll need to configure your bucket to serve a website. See [this tutorial](http://docs.aws.amazon.com/gettingstarted/latest/swh/website-hosting-intro.html) for that, particularly step 1 & 2.

The reason why I still think you need to configure your bucket for static website hosting is that your website _should not_ be accessible at [https://s3.amazonaws.com/www.stencilled.me/index.html](https://s3.amazonaws.com/www.stencilled.me/index.html) . That’s because you cannot use a DNS record against that address to resolve [www.stencilled.me](http://www.stencilled.me) to that file location.

Your wercker config file looks okay (though you do use an old version of Hugo, but that may be deliberate for some reason), and your config file points to the wrong base url.

If you follow the AWS tutorial for static website hosting, you’ll get the publicly accessible website URL for your bucket, which will be something like [http://www.stencilled.me.s3-website.eu-central-1.amazonaws.com](http://www.stencilled.me.s3-website.eu-central-1.amazonaws.com).

Good luck!

---

<div class="post-metadata">

**Author:** ![rdwatters](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/rdwatters/32/2848_2.png) [@rdwatters](https://discourse.gohugo.io/u/rdwatters)\
**Post date:** [March 9, 2017, 8:10am UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/14 "2017-03-09T08:10:52Z")

</div>

Something is wrong in your templating…

 ![](https://canada1.discourse-cdn.com/flex036/uploads/gohugo/original/2X/8/84bc6424979f4e8b5ead3e0ab92e57765ba0f44b.png)

Use `relURL`, for example…

```auto
<script src="{{ "js/main.js" | relURL }}"></script>

```

And test it locally. HTH.

---

<div class="post-metadata">

**Author:** ![senthil\_thyagarajan](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/senthil_thyagarajan/32/2772_2.png) [@senthil\_thyagarajan](https://discourse.gohugo.io/u/senthil_thyagarajan)\
**Post date:** [March 9, 2017, 7:27pm UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/15 "2017-03-09T19:27:20Z")

</div>

@rdwatters In local I see it like this

`<script src="http://localhost:1313//js/main.js"></script>`

---

<div class="post-metadata">

**Author:** ![senthil\_thyagarajan](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/senthil_thyagarajan/32/2772_2.png) [@senthil\_thyagarajan](https://discourse.gohugo.io/u/senthil_thyagarajan)\
**Post date:** [March 9, 2017, 7:28pm UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/16 "2017-03-09T19:28:57Z")

</div>

Thanks @Jura . This is how my URL looks like [http://www.stencilled.me.s3-website-us-east-1.amazonaws.com](http://www.stencilled.me.s3-website-us-east-1.amazonaws.com)

---

<div class="post-metadata">

**Author:** ![rdwatters](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/rdwatters/32/2848_2.png) [@rdwatters](https://discourse.gohugo.io/u/rdwatters)\
**Post date:** [March 9, 2017, 8:19pm UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/17 "2017-03-09T20:19:59Z")

</div>

> [@senthil\_thyagarajan](#):
>
> \<script src=“[http://localhost:1313//js/main.js](http://localhost:1313//js/main.js)”\>\</script\>

Using `relURL` and with my exact example in your templates?

Do you have `relativeURLs` set to `true` in your site `config`?

Your assets (in this case, your `.js` files) are not being ported over correctly because you have something set incorrectly in your configuration and/or templating; i.e., the browser is currently looking for a _directory_ called `www.stencilled.me`…which doesn’t exist.

---

<div class="post-metadata">

**Author:** ![senthil\_thyagarajan](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/senthil_thyagarajan/32/2772_2.png) [@senthil\_thyagarajan](https://discourse.gohugo.io/u/senthil_thyagarajan)\
**Post date:** [March 9, 2017, 8:45pm UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/18 "2017-03-09T20:45:37Z")

</div>

@rdwatters Here is my config and the whole website I am trying to deploy

> **[senthilthyagarajan/stencilled.me](https://github.com/senthilthyagarajan/stencilled.me)**
>
> stencilled.me - Website

I dont have any relative url parameter .

Thank You for your time again.

---

<div class="post-metadata">

**Author:** ![rdwatters](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/rdwatters/32/2848_2.png) [@rdwatters](https://discourse.gohugo.io/u/rdwatters)\
**Post date:** [March 9, 2017, 8:54pm UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/19 "2017-03-09T20:54:17Z")

</div>

These are the lines I’m talking about:

> <https://github.com/senthilthyagarajan/stencilled.me/blob/master/themes/beautifulhugo/layouts/partials/footer.html#L199-L200>

1. I would recommend contacting the theme’s author since this is going to inevitably cause others trouble the same way it has for you; better yet, **_submit a pull request_**.
2. You need the full URL, including protocol, in your site’s configuration file for your `baseURL`
3. Copy [everything in this file](https://github.com/senthilthyagarajan/stencilled.me/blob/master/themes/beautifulhugo/layouts/partials/footer.html#L197-L200) over to a new file at `layouts/partials/footer.html` and then change lines 199&200 to what I mentioned above:

```auto
<script src="{{ "js/main.js" | relURL }}"></script>
<script src="{{ "js/highlight.min.js" | relURL }}"></script>

```

Then set [this line in your configuration](https://github.com/senthilthyagarajan/stencilled.me/blob/master/config.toml#L4) to `relativeURLs = true`.

Let me know how that works out 😄

---

<div class="post-metadata">

**Author:** ![rdwatters](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/rdwatters/32/2848_2.png) [@rdwatters](https://discourse.gohugo.io/u/rdwatters)\
**Post date:** [March 9, 2017, 9:53pm UTC](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733/21 "2017-03-09T21:53:50Z")

</div>

Try setting baseURL to an empty string. `""`  
I get the feeling this is something related to the way you specifically have your S3/router set up…

Or something about the way `baseURL` works with respect to your extra-long S3 baseURL, but this is all just a guess.

Also, I’m assuming you want to deploy to [stencilled.me](http://stencilled.me) and not `http://www.stencilled.me.s3-website-us-east-1.amazonaws.com`…

[Next page](https://discourse.gohugo.io/t/deploying-hugo-on-s3-using-wercker/5733.md?page=2)