Using resources.PostCSS to handle stylesheets

Regis Philibert

06.19.2021 16fc5e6d801d45d3c907b220245cf3ad58086253

Using resources.PostCSS to handle stylesheets

 assets/ananke/css/_code.css

 assets/ananke/css/_hugo-internal-templates.css

 assets/ananke/css/_social-icons.css

 assets/ananke/css/_styles.css

 assets/ananke/css/_tachyons.css

 assets/ananke/css/main.css

 assets/ananke/css/postcss.config.js

New file
@@ -0,0 +1,7 @@
module.exports = {
    plugins: [
        require("postcss-import")({
            path: ["/assets/ananke/css"],
        })
    ],
};

 config.yaml

New file
@@ -0,0 +1,3 @@
module:
  hugoVersion:
    min: "0.79.0"

 layouts/_default/baseof.html

@@ -15,14 +15,7 @@
      <META NAME="ROBOTS" CONTENT="NOINDEX, NOFOLLOW">
    {{ end }}

    {{ $stylesheet := .Site.Data.webpack_assets.app }}
    {{ with $stylesheet.css }}
      <link href="{{ relURL (printf "%s%s" "dist/" .) }}" rel="stylesheet">
    {{ end }}

    {{ range .Site.Params.custom_css }}
      <link rel="stylesheet" href="{{ relURL (.) }}">
    {{ end }}
    {{ partial "site-style.html" . }}

    {{ block "favicon" . }}
      {{ partialCached "site-favicon.html" . }}

 layouts/index.html

@@ -1,4 +1,5 @@
{{ define "main" }}

  <article class="cf ph3 ph5-l pv3 pv4-l f4 tc-l center measure-wide lh-copy mid-gray">
    {{ .Content }}
  </article>

 layouts/partials/site-style.html

New file
@@ -0,0 +1,10 @@
{{ with resources.Get "/ananke/css/main.css" }}
    {{ $settings := dict "config" "/assets/ananke/css/postcss.config.css" }}
    {{ $style := . | resources.PostCSS }}
    {{ with $style }}
      <link rel="stylesheet" href="{{ .RelPermalink }}">
    {{ end }}
{{ end }}
{{ range .Site.Params.custom_css }}
  <link rel="stylesheet" href="{{ relURL (.) }}">
{{ end }}

 package.hugo.json

New file
@@ -0,0 +1,34 @@
{
  "name": "gohugo-theme-ananke",
  "version": "2.7.0",
  "description": "Base Theme to start Hugo Sites",
  "main": "index.js",
  "repository": {
    "type": "git",
    "url": "git+https://github.com/theNewDynamic/gohugo-theme-ananke.git"
  },
  "scripts": {
    "version": "auto-changelog -p --template keepachangelog --commit-limit 0 && git add CHANGELOG.md"
  },
  "keywords": [
    "hugo",
    "gohugo"
  ],
  "author": "budparr",
  "license": "MIT",
  "bugs": {
    "url": "https://github.com/theNewDynamic/gohugo-theme-ananke/issues"
  },
  "homepage": "https://github.com/theNewDynamic/gohugo-theme-ananke#readme",
  "devDependencies": {
    "babel-core": "^6.24.1",
    "babel-loader": "^7.0.0",
    "babel-preset-env": "^1.4.0",
    "cssnano": "^3.10.0",
        "postcss-cli": "^7.1.0",
        "postcss-import": "^12.0.1",
    "postcss-cssnext": "^2.10.0",
    "tachyons": "^4.9.1",
    "auto-changelog": "^1.16.1"
  }
}

 package.json

@@ -1,26 +1,49 @@
{
  "name": "gohugo-default-theme",
  "version": "2.6.1",
  "description": "Base Theme to start Hugo Sites",
  "main": "index.js",
  "repository": {
    "type": "git",
    "url": "git+https://github.com/theNewDynamic/thenewdynamic.com.git"
  },
  "scripts": {
    "version": "auto-changelog -p --template keepachangelog --commit-limit 0 && git add CHANGELOG.md"
  },
  "keywords": [
    "hugo",
    "gohugo"
  ],
  "author": "budparr",
  "license": "MIT",
  "bugs": {
    "url": "https://github.com/theNewDynamic/thenewdynamic.com/issues"
  },
  "homepage": "https://github.com/theNewDynamic/thenewdynamic.com#readme",
 "author": "budparr",
 "bugs": {
  "url": "https://github.com/theNewDynamic/gohugo-theme-ananke/issues"
 },
 "comments": {
  "dependencies": {},
  "devDependencies": {
    "auto-changelog": "^1.16.1"
   "auto-changelog": "project",
   "babel-core": "project",
   "babel-loader": "project",
   "babel-preset-env": "project",
   "cssnano": "project",
   "postcss-cli": "project",
   "postcss-cssnext": "project",
   "postcss-import": "project",
   "tachyons": "project"
  }
}
 },
 "dependencies": {},
 "description": "Base Theme to start Hugo Sites",
 "devDependencies": {
  "auto-changelog": "^1.16.1",
  "babel-core": "^6.24.1",
  "babel-loader": "^7.0.0",
  "babel-preset-env": "^1.4.0",
  "cssnano": "^3.10.0",
  "postcss-cli": "^7.1.0",
  "postcss-cssnext": "^2.10.0",
  "postcss-import": "^12.0.1",
  "tachyons": "^4.9.1"
 },
 "homepage": "https://github.com/theNewDynamic/gohugo-theme-ananke#readme",
 "keywords": [
  "hugo",
  "gohugo"
 ],
 "license": "MIT",
 "main": "index.js",
 "name": "gohugo-theme-ananke",
 "repository": {
  "type": "git",
  "url": "git+https://github.com/theNewDynamic/gohugo-theme-ananke.git"
 },
 "scripts": {
  "version": "auto-changelog -p --template keepachangelog --commit-limit 0 \u0026\u0026 git add CHANGELOG.md"
 },
 "version": "2.7.0"
}

 src/css/postcss.config.js

File was deleted

 src/js/main.js

File was deleted

 src/package-lock.json

File was deleted

 src/package.json

File was deleted

 src/readme.md

File was deleted

 src/webpack.config.js

File was deleted