fix build, update dependencies

ci config

upgrade storybook

storybookjs/storybook#14805

bin/deps-install

@@ -7,10 +7,10 @@ cd "$(dirname ${BASH_SOURCE})/.."
 cd bootstrap-theme-leihs
 npm ci --no-audit
 npm run ensure-sass
-
 cd -
-npm ci --no-audit
 
+# NOTE: optimize network access, first try with local cache only
+npm ci --no-audit --offline || npm ci --no-audit
 cd -
 
 # vi: ft=sh

bootstrap-theme-leihs/package.json

@@ -7,29 +7,29 @@
     "build": "webpack --config webpack/prod.config.js",
     "watch": "webpack --watch --config webpack/prod.config.js",
     "postinstall": "npm run -S ensure-sass",
-    "ensure-sass": "echo '[!] trying to rebuild node-sass in case it is broken'; npx node-sass --version &> /dev/null || npm rebuild node-sass",
+    "ensure-sass": "echo '[!] trying to rebuild node-sass in case it is broken'; node -p \"require('node-sass').info\" &> /dev/null || npm rebuild node-sass",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "author": "",
   "license": "ISC",
   "browserslist": "defaults, not dead",
   "dependencies": {
-    "@fortawesome/fontawesome-svg-core": "^1.2.32",
-    "bootstrap": "^4.5.3"
+    "@fortawesome/fontawesome-svg-core": "^1.2.35",
+    "bootstrap": "^4.6.0"
   },
   "devDependencies": {
     "@leihs/calendar": "2.0.0-beta.5",
-    "autoprefixer": "^9.8.6",
-    "css-loader": "^3.6.0",
-    "mini-css-extract-plugin": "^0.9.0",
-    "node-sass": "^4.14.1",
-    "postcss-loader": "^3.0.0",
+    "autoprefixer": "^10.2.6",
+    "css-loader": "^5.2.6",
+    "mini-css-extract-plugin": "^1.6.0",
+    "node-sass": "^6.0.0",
+    "postcss-loader": "^5.3.0",
     "precss": "^4.0.0",
-    "sass-loader": "^8.0.2",
-    "style-loader": "^1.3.0",
-    "url-loader": "^3.0.0",
-    "webpack": "^4.44.2",
-    "webpack-cli": "^3.3.12"
+    "sass-loader": "^12.0.0",
+    "style-loader": "^2.0.0",
+    "url-loader": "^4.1.1",
+    "webpack": "^5.38.1",
+    "webpack-cli": "^4.7.0"
   },
   "prettier": {
     "printWidth": 80,

bootstrap-theme-leihs/webpack/prod.config.js

@@ -18,9 +18,11 @@ module.exports = {
           {
             loader: 'postcss-loader', // Run post css actions
             options: {
-              plugins: function() {
-                // post css plugins, can be exported to postcss.config.js
-                return [require('precss'), require('autoprefixer')]
+              postcssOptions: {
+                plugins: function() {
+                  // post css plugins, can be exported to postcss.config.js
+                  return [require('precss'), require('autoprefixer')]
+                }
               }
             }
           },

cider-ci.yml

@@ -4,6 +4,7 @@ jobs:
     name: Lint
     run_when:
       any branch is pushed: { type: branch, include_match: ^.*$ }
+    include: cider-ci/task_defaults.yml
     tasks:
       lint:
         include: cider-ci/lint_task-component.yml

cider-ci/build-and-test_task-component.yml

@@ -2,19 +2,19 @@ include: cider-ci/build_task-component.yml
 
 environment_variables:
   CI: 'true'
-traits:
-  npm: true
 
 scripts:
   prepare-test:
     start_when:
       build-ui: { script_key: build-ui }
     timeout: 10 minutes
     body: |
+      source ~/.nvm/nvm.sh && nvm use "$NVM_NODEJS_VERSION"
       npm add --force ./test/
   test:
     start_when:
       prepared: { script_key: prepare-test }
     timeout: 10 minutes
     body: |
+      source ~/.nvm/nvm.sh && nvm use "$NVM_NODEJS_VERSION"
       npm run test

cider-ci/build_task-component.yml

@@ -1,12 +1,14 @@
-include: cider-ci/install-ruby_task-component.yml
-
-traits:
-  npm: true
+include:
+  - path: cider-ci/install-ruby_task-component.yml
+  - path: cider-ci/install-nodejs_task-component.yml
 
 scripts:
   build-ui:
     timeout: 10 minutes
-    body:  ./bin/build
+    body: |
+      source ~/.nvm/nvm.sh && nvm use "$NVM_NODEJS_VERSION"
+      ./bin/build
     exclusive_executor_resource: leihs-ui-build
     start_when:
-      install-ruby-passed: {script_key: install-ruby}
+      install-ruby-passed: { script_key: install-ruby }
+      install-nodejs-passed: { script_key: install-nodejs }

cider-ci/install-nodejs_task-component.yml

@@ -0,0 +1,18 @@
+traits:
+  'nvm-nodejs-version-manager': true
+  Bash: true
+
+scripts:
+  install-nodejs:
+    exclusive_executor_resource: nodejs-install_{{$NVM_NODEJS_VERSION}}
+    timeout: 20 Minutes
+    body: |
+      #!/usr/bin/env bash
+      set -eu
+
+      source ~/.nvm/nvm.sh
+      nvm install "$NVM_NODEJS_VERSION"
+      nvm use "$NVM_NODEJS_VERSION"
+
+      which node
+      node --version

cider-ci/lint_task-component.yml

@@ -1,8 +1,11 @@
-environment_variables:
-  CI: 'true'
-traits:
-  npm: true
+include: cider-ci/install-nodejs_task-component.yml
+
 scripts:
   lint:
     timeout: 10 minutes
-    body: 'npm ci && npm run ci:lint'
+    start_when: { install-nodejs-passed: { script_key: install-nodejs } }
+    body: |
+      source ~/.nvm/nvm.sh && nvm use "$NVM_NODEJS_VERSION"
+      set -exu
+      { npm ci --no-audit --offline || npm --no-audit ci ;}
+      npm run ci:lint

cider-ci/task_defaults.yml

@@ -1,5 +1,7 @@
 task_defaults:
   environment_variables:
+    CI: 'true' # needed for frontend build packages, they detect CI vs DEV this way
     RUBY: '{{RUBY_ENGINE}}-{{RUBY_VERSION}}'
     RUBY_ENGINE: ruby
     RUBY_VERSION: 2.7.2
+    NVM_NODEJS_VERSION: '14'