Generated CSS completely different on deployed version vs local

I am building a website using the “KeepIt” theme. When I run the site locally (using hugo serve), it shows up correctly. Correct fonts, text alignment that I specified in the theme’s scss files etc. I deploy the site to github pages using TravisCI and the main CSS file is completely different. This is my .travis.yml

---
install:
  - curl -LO https://github.com/gohugoio/hugo/releases/download/v0.74.3/hugo_0.74.3_Linux-64bit.deb
  - sudo dpkg -i hugo_0.74.3_Linux-64bit.deb
  - rm -rf public/
script:
  - HUGO_ENV=production hugo --gc --minify -v
  - cp CNAME public/
deploy:
  provider: pages
  skip_cleanup: true
  local_dir: public
  github_token: $GITHUB_TOKEN  # Set in the settings page of your repository, as a secure variable
  keep_history: true
  repo: repo/path
  target_branch: master
  on:
    branch: master

I also tried running the commands exactly as they are run on Travis (with the same version of Hugo), and I got the same CSS file that I got using “hugo serve”. I am not using submodules, I commit the theme files directly to my repo (along with some minor changes that I made).

Here is an example of how different the files are: https://gist.github.com/thomasantony/1883ae286aa1584e7c082d414ab5bdc8

It almost looks like a completely different theme is being used. Any ideas what could be happening?

This is my hugo env on my local machine:

Hugo Static Site Generator v0.74.3-DA0437B4/extended darwin/amd64 BuildDate: 2020-07-23T16:28:32Z
GOOS="darwin"
GOARCH="amd64"
GOVERSION="go1.14.3"

This is the output on Travis CI

Hugo Static Site Generator v0.74.3-DA0437B4 linux/amd64 BuildDate: 2020-07-23T16:22:34Z
GOOS="linux"
GOARCH="amd64"
GOVERSION="go1.14.3"

Update: It seems like the offending CSS code was in the themes/KeepIt/resources/_gen folder. However, after deleting this, the build on travis fails with the error:

Error: Error building site: TOCSS: failed to transform "css/main.scss" (text/x-scss): resource "scss/css/main.scss_b95b077eb505d5c0aff8055eaced30ad" not found in file cache
The command "HUGO_ENV=production hugo --gc --minify -v" exited with 255.

The build is still fine on the local side.

Solved it. The problem was that I was not using hugo extended on TravisCI. It was reverting to some cached css file from the theme rather than rebuilding from SCSS.

Hopefully this helps someone in the future!

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.