How can I inject baseUrl to sass file?

support
1

Hi there,
I’m just wondering if there is an easy way to inject to baseUrl variable in the config into a sass variable.
For staging, production and dev enviroments I have different public paths I would like to use.
Ideally it would be great if I could do this by an npm script.
Just wondering if anyone has any ideas?
Many thanks in advance.

2

This is outside the scope of Hugo and we are unable to help you with this.

If you are using Hugo to build your SASS files, you can ExecuteAsTemplate: ExecuteAsTemplate | Hugo

3

If on linux you can make a simple bash script containing something like:

sed -i "1i $a" $filename  ##inject a line to the top of the file
sed -i "/^\/\/ local fonts:/a $a" $filename  ## inject a line below a string

where $a is your text to inject

Then call this script from npm.
Just a couple of ideas, you could also do a substitute command.

Then call the script from npm.

4

You can create different config files for each environment and override baseUrl and other parameters. All you need to do is create the following directories and files:

config
  /_default/config.{yaml,toml,json}
  /dev/config.{yaml,toml,json}
  /staging/config.{yaml,toml,json}

The _default folder can be considered the production config.

EDIT: I have made a short bash script for myself to make it more convenient to push to different environments. You can modify and take the parts you need if you like! ~rsolvang/pu.sh-hugo - sourcehut git

EDIT2: You can take a look at an example from one of my projects here: ~rsolvang/hetlankheet-website: config/ - sourcehut git

EDIT3: Also check out the official documentation: Configure Hugo | Hugo