Add vscode devcontainer

.devcontainer/devcontainer.json

@@ -0,0 +1,31 @@
+{
+  "name": "Jekyll",
+  "image": "mcr.microsoft.com/devcontainers/jekyll:2-bullseye",
+  "onCreateCommand": "git config --global --add safe.directory ${containerWorkspaceFolder}",
+  "postCreateCommand": "bash .devcontainer/post-create.sh",
+  "postAttachCommand": "exec zsh",
+  "customizations": {
+    "vscode": {
+      "settings": {
+        // Speed up extension installation
+        "extensions.verifySignature": false
+      },
+      "extensions": [
+        // Liquid tags auto-complete
+        "killalau.vscode-liquid-snippets",
+        // Liquid syntax highlighting and formatting
+        "Shopify.theme-check-vscode",
+        // Shell
+        "timonwong.shellcheck",
+        "mkhl.shfmt",
+        // Common formatter
+        "EditorConfig.EditorConfig",
+        "esbenp.prettier-vscode",
+        "stylelint.vscode-stylelint",
+        "yzhang.markdown-all-in-one",
+        // Git
+        "mhutchie.git-graph"
+      ]
+    }
+  }
+}

.devcontainer/post-create.sh

@@ -0,0 +1,32 @@
+#!/usr/bin/env bash
+
+setup_node() {
+  bash -i -c "nvm install --lts && nvm install-latest-npm"
+
+  [[ -f package-lock.json && -d node_modules ]] || npm i
+}
+
+setup_assets() {
+  has_built_css=false
+  has_built_js=false
+
+  CSS_DIST="_sass/dist"
+  JS_DIST="assets/js/dist"
+
+  if [ -d "$CSS_DIST" ]; then
+    [ -z "$(ls -A $CSS_DIST)" ] || has_built_css=true
+  fi
+
+  if [ -d "$JS_DIST" ]; then
+    [ -z "$(ls -A $JS_DIST)" ] || has_built_js=true
+  fi
+
+  $has_built_css || npm run build:css
+  $has_built_js || npm run build:js
+}
+
+setup_node
+setup_assets
+
+# Install dependencies for shfmt extension
+curl -sS https://webi.sh/shfmt | sh &>/dev/null

.github/dependabot.yml

@@ -23,3 +23,7 @@ updates:
           - "major"
     schedule:
       interval: "weekly"
+  - package-ecosystem: "devcontainers"
+    directory: "/"
+    schedule:
+      interval: weekly

.gitignore

@@ -17,7 +17,7 @@ package-lock.json
 
 # IDE configurations
 .idea
-.vscode
+.vscode/*
 !.vscode/settings.json
 !.vscode/extensions.json
 

.vscode/extensions.json

@@ -1,13 +1,3 @@
 {
-  "recommendations": [
-    // Liquid tags auto-complete
-    "killalau.vscode-liquid-snippets",
-    // Liquid syntax highlighting and formatting
-    "Shopify.theme-check-vscode",
-    // Common formatter
-    "esbenp.prettier-vscode",
-    "foxundermoon.shell-format",
-    "stylelint.vscode-stylelint",
-    "yzhang.markdown-all-in-one"
-  ]
+  "recommendations": ["ms-vscode-remote.remote-containers"]
 }

.vscode/settings.json

@@ -15,13 +15,13 @@
     "editor.defaultFormatter": "Shopify.theme-check-vscode"
   },
   "[shellscript]": {
-    "editor.defaultFormatter": "foxundermoon.shell-format"
+    "editor.defaultFormatter": "mkhl.shfmt"
   },
   // Disable vscode built-in stylelint
   "css.validate": false,
   "scss.validate": false,
   "less.validate": false,
   // Stylint extension settings
-  "stylelint.snippet": ["css", "less", "postcss", "scss"],
-  "stylelint.validate": ["css", "less", "postcss", "scss"]
+  "stylelint.snippet": ["css", "scss"],
+  "stylelint.validate": ["css", "scss"]
 }

tools/run.sh

@@ -46,5 +46,11 @@ if $prod; then
   command="JEKYLL_ENV=production $command"
 fi
 
+if [ -e /proc/1/cgroup ]; then
+  if grep -q docker /proc/1/cgroup; then
+    command="$command --force_polling"
+  fi
+fi
+
 echo -e "\n> $command\n"
 eval "$command"