Oryx icon indicating copy to clipboard operation
Oryx copied to clipboard

Error using PostCSS in Hugo site

Open tnsholding opened this issue 3 years ago • 1 comments

Trying to set up a Hugo site with Static Web App. A default Hugo site with most themes works fine. But when trying to use theme 'docsy' (https://www.docsy.dev/) I get the following error from the default build and deploy job:

Using Hugo version:
hugo v0.89.4-AB01BA6E+extended linux/amd64 BuildDate=2021-11-17T08:24:09Z VendorInfo=gohugoio

Start building sites … 
hugo v0.89.4-AB01BA6E+extended linux/amd64 BuildDate=2021-11-17T08:24:09Z VendorInfo=gohugoio
Total in 490 ms
Error: Error building site: POSTCSS: failed to transform "scss/main.css" (text/css). Check your PostCSS installation; install with "npm install postcss-cli". See https://gohugo.io/hugo-pipes/postcss/: this feature is not available in your current Hugo version, see https://goo.gl/YMrWcn for more information


---End of Oryx build logs---
Oryx has failed to build the solution.

According to the documentation of Docsy the PostCSS needs to be installed with npm (https://www.docsy.dev/docs/getting-started/#install-postcss ). But when adding a package.json with the dependencies to the root of the site, then the Oryx build now complains about the following error instead:

Detecting platforms...
Detected following platforms:
  nodejs: 14.17.6
  hugo: 0.89.4
Version '14.17.6' of platform 'nodejs' is not installed. Generating script to install it...
Version '0.89.4' of platform 'hugo' is not installed. Generating script to install it...
Error: Could not find either 'build' or 'build:azure' node under 'scripts' in package.json. Could not find value for custom run build command using the environment variable key 'RUN_BUILD_COMMAND'.Could not find tools for building monorepos, no 'lerna.json' or 'lage.config.js' files found.


---End of Oryx build logs---
Oryx could not find a 'build' or 'build:azure' script in the package configuration. Please add one of these commands to your package configuration file (i.e. package.json). Alternatively, you can add the app_build_command to the build/deploy section of your workflow file. For example, app_build_command: 'npm run docs:build'

How would I set up the build to be able to use themes like Docsy requiring PostCSS?

tnsholding avatar Jan 02 '22 12:01 tnsholding

Hi @tnsholding , instead of adding a package.json file to your project and let oryx detect your app as a node app, we set up 'CUSTOM_BUILD_COMMAND' or 'PRE_BUILD_COMMAND' to be 'npm install postcss-cli' to install dependencies. The error message shows up when the app has a package.json file and detected as a node app but not having other node required configuration. Could you try to set up env to see if it works?

qianz2 avatar Jan 10 '22 23:01 qianz2

We're closing this issue due to its age. If this is still impacting you please open a new issue and simply link back to this one.

simonjj avatar Jan 11 '24 16:01 simonjj