Attachment 170709 Details for Bug 35402 – Bug 35402: (follow-up) Use ~ to resolve to nearest node_modules when building css

[patch] Bug 35402: (follow-up) Use ~ to resolve to nearest node_modules when building css

Bug-35402-follow-up-Use--to-resolve-to-nearest-nod.patch (text/plain), 15.50 KB, created by Paul Derscheid on 2024-08-26 11:38:42 UTC

(hide)

Description:

Filename:

MIME Type:

Creator: Paul Derscheid

Created: 2024-08-26 11:38:42 UTC

Size: 15.50 KB

patch

obsolete

>From 67480d860602303200949c0246c6b937e5530aa7 Mon Sep 17 00:00:00 2001
>From: Paul Derscheid <paul.derscheid@lmscloud.de>
>Date: Mon, 26 Aug 2024 13:31:46 +0200
>Subject: [PATCH] Bug 35402: (follow-up) Use ~ to resolve to nearest
> node_modules when building css
>
>- This patch adds a new dev dependency node-sass-tilde-importer.
>- We use the tilde to resolve to the nearest node_moduldes, meaning
>	- /kohadevbox/koha/node_modules
>	or
>	- /kohadevbox/node_modules
>- We explicitly prefix the last path component with an underscore to prevent the
>  resolution from failing (this doesn't seem necessary for all cases, though)
>---
> gulpfile.js                                   |  2 +
> .../intranet-tmpl/prog/css/src/installer.scss | 40 ++++----
> .../prog/css/src/staff-global.scss            | 91 +++++++++----------
> .../opac-tmpl/bootstrap/css/src/_common.scss  | 85 +++++++++--------
> package.json                                  |  1 +
> yarn.lock                                     | 12 +++
> 6 files changed, 122 insertions(+), 109 deletions(-)
>
>diff --git a/gulpfile.js b/gulpfile.js
>index 7c6a56372f..918ea10b66 100644
>--- a/gulpfile.js
>+++ b/gulpfile.js
>@@ -11,6 +11,7 @@ const util = require('util');
> const stream = require('stream/promises');
> 
> const sass = require('gulp-sass')(require('sass'));
>+const tildeImporter = require('node-sass-tilde-importer');
> const rtlcss = require('gulp-rtlcss');
> const sourcemaps = require('gulp-sourcemaps');
> const autoprefixer = require('gulp-autoprefixer');
>@@ -30,6 +31,7 @@ var CSS_BASE = args.view == "opac"
>     : STAFF_CSS_BASE;
> 
> var sassOptions = {
>+    importer: tildeImporter,
>     includePaths: [
>         __dirname + '/node_modules',
>         __dirname + '/../node_modules'
>diff --git a/koha-tmpl/intranet-tmpl/prog/css/src/installer.scss b/koha-tmpl/intranet-tmpl/prog/css/src/installer.scss
>index 4e08dec07b..1450471404 100644
>--- a/koha-tmpl/intranet-tmpl/prog/css/src/installer.scss
>+++ b/koha-tmpl/intranet-tmpl/prog/css/src/installer.scss
>@@ -1,32 +1,32 @@
> // scss-docs-start import-stack
> // Configuration
>-@import "../../../../../node_modules/bootstrap5/scss/functions";
>+@import "~bootstrap5/scss/_functions";
> 
> // Include any default variable overrides here
>-@import "variables";
>+@import "_variables";
> 
> // Include remainder of required Bootstrap stylesheets
>-@import "../../../../../node_modules/bootstrap5/scss/variables";
>-@import "../../../../../node_modules/bootstrap5/scss/mixins";
>+@import "~bootstrap5/scss/_variables";
>+@import "~bootstrap5/scss/_mixins";
> 
> $enable-dark-mode: false;
> 
>-@import "../../../../../node_modules/bootstrap5/scss/maps";
>-@import "../../../../../node_modules/bootstrap5/scss/utilities";
>-@import "../../../../../node_modules/bootstrap5/scss/root";
>-@import "../../../../../node_modules/bootstrap5/scss/reboot";
>-@import "../../../../../node_modules/bootstrap5/scss/type";
>-@import "../../../../../node_modules/bootstrap5/scss/containers";
>-@import "../../../../../node_modules/bootstrap5/scss/grid";
>-@import "../../../../../node_modules/bootstrap5/scss/forms";
>-@import "../../../../../node_modules/bootstrap5/scss/buttons";
>-@import "../../../../../node_modules/bootstrap5/scss/transitions";
>-@import "../../../../../node_modules/bootstrap5/scss/breadcrumb";
>-@import "../../../../../node_modules/bootstrap5/scss/badge";
>-@import "../../../../../node_modules/bootstrap5/scss/alert";
>-@import "../../../../../node_modules/bootstrap5/scss/helpers";
>-@import "../../../../../node_modules/bootstrap5/scss/utilities/api";
>-@import "flatpickr";
>+@import "~bootstrap5/scss/_maps";
>+@import "~bootstrap5/scss/_utilities";
>+@import "~bootstrap5/scss/_root";
>+@import "~bootstrap5/scss/_reboot";
>+@import "~bootstrap5/scss/_type";
>+@import "~bootstrap5/scss/_containers";
>+@import "~bootstrap5/scss/_grid";
>+@import "~bootstrap5/scss/_forms";
>+@import "~bootstrap5/scss/_buttons";
>+@import "~bootstrap5/scss/_transitions";
>+@import "~bootstrap5/scss/_breadcrumb";
>+@import "~bootstrap5/scss/_badge";
>+@import "~bootstrap5/scss/_alert";
>+@import "~bootstrap5/scss/_helpers";
>+@import "~bootstrap5/scss/_utilities/api";
>+@import "_flatpickr";
> 
> body {
>     background-color: #EEE;
>diff --git a/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss b/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss
>index 2d3bed2ad2..c0939e417f 100644
>--- a/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss
>+++ b/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss
>@@ -1,66 +1,65 @@
>-@import "../../../../../node_modules/bootstrap5/scss/mixins/banner";
>-@import "../../../../../node_modules/bootstrap5/scss/mixins/banner";
>-@include bsBanner("");
>+@import "~bootstrap5/scss/mixins/_banner";
>+@import "~bootstrap5/scss/mixins/_banner";
> 
> // scss-docs-start import-stack
>+@import "~bootstrap5/scss/_functions";
> // Configuration
>-@import "../../../../../node_modules/bootstrap5/scss/functions";
> // Include any default variable overrides here
>-@import "variables";
>+@import "_variables";
> 
> // Include remainder of required Bootstrap stylesheets
>-@import "../../../../../node_modules/bootstrap5/scss/variables";
>-@import "../../../../../node_modules/bootstrap5/scss/mixins";
>+@import "~bootstrap5/scss/_variables";
>+@import "~bootstrap5/scss/_mixins";
> 
> $enable-dark-mode: false;
> 
>-@import "../../../../../node_modules/bootstrap5/scss/maps";
>-@import "../../../../../node_modules/bootstrap5/scss/utilities";
>+@import "~bootstrap5/scss/_maps";
>+@import "~bootstrap5/scss/_utilities";
> 
> // Layout & components
>-@import "../../../../../node_modules/bootstrap5/scss/root";
>-@import "../../../../../node_modules/bootstrap5/scss/reboot";
>-@import "../../../../../node_modules/bootstrap5/scss/type";
>-@import "../../../../../node_modules/bootstrap5/scss/images";
>-@import "../../../../../node_modules/bootstrap5/scss/containers";
>-@import "../../../../../node_modules/bootstrap5/scss/grid";
>-@import "../../../../../node_modules/bootstrap5/scss/tables";
>-@import "../../../../../node_modules/bootstrap5/scss/forms";
>-@import "../../../../../node_modules/bootstrap5/scss/buttons";
>-@import "../../../../../node_modules/bootstrap5/scss/transitions";
>-@import "../../../../../node_modules/bootstrap5/scss/dropdown";
>-@import "../../../../../node_modules/bootstrap5/scss/button-group";
>-@import "../../../../../node_modules/bootstrap5/scss/nav";
>-@import "../../../../../node_modules/bootstrap5/scss/navbar";
>-@import "../../../../../node_modules/bootstrap5/scss/card";
>-@import "../../../../../node_modules/bootstrap5/scss/accordion";
>-@import "../../../../../node_modules/bootstrap5/scss/breadcrumb";
>-@import "../../../../../node_modules/bootstrap5/scss/pagination";
>-@import "../../../../../node_modules/bootstrap5/scss/badge";
>-@import "../../../../../node_modules/bootstrap5/scss/alert";
>-@import "../../../../../node_modules/bootstrap5/scss/progress";
>-@import "../../../../../node_modules/bootstrap5/scss/list-group";
>-@import "../../../../../node_modules/bootstrap5/scss/close";
>-@import "../../../../../node_modules/bootstrap5/scss/toasts";
>-@import "../../../../../node_modules/bootstrap5/scss/modal";
>-@import "../../../../../node_modules/bootstrap5/scss/tooltip";
>-@import "../../../../../node_modules/bootstrap5/scss/popover";
>-@import "../../../../../node_modules/bootstrap5/scss/carousel";
>-@import "../../../../../node_modules/bootstrap5/scss/spinners";
>-@import "../../../../../node_modules/bootstrap5/scss/offcanvas";
>-@import "../../../../../node_modules/bootstrap5/scss/placeholders";
>+@import "~bootstrap5/scss/_root";
>+@import "~bootstrap5/scss/_reboot";
>+@import "~bootstrap5/scss/_type";
>+@import "~bootstrap5/scss/_images";
>+@import "~bootstrap5/scss/_containers";
>+@import "~bootstrap5/scss/_grid";
>+@import "~bootstrap5/scss/_tables";
>+@import "~bootstrap5/scss/_forms";
>+@import "~bootstrap5/scss/_buttons";
>+@import "~bootstrap5/scss/_transitions";
>+@import "~bootstrap5/scss/_dropdown";
>+@import "~bootstrap5/scss/_button-group";
>+@import "~bootstrap5/scss/_nav";
>+@import "~bootstrap5/scss/_navbar";
>+@import "~bootstrap5/scss/_card";
>+@import "~bootstrap5/scss/_accordion";
>+@import "~bootstrap5/scss/_breadcrumb";
>+@import "~bootstrap5/scss/_pagination";
>+@import "~bootstrap5/scss/_badge";
>+@import "~bootstrap5/scss/_alert";
>+@import "~bootstrap5/scss/_progress";
>+@import "~bootstrap5/scss/_list-group";
>+@import "~bootstrap5/scss/_close";
>+@import "~bootstrap5/scss/_toasts";
>+@import "~bootstrap5/scss/_modal";
>+@import "~bootstrap5/scss/_tooltip";
>+@import "~bootstrap5/scss/_popover";
>+@import "~bootstrap5/scss/_carousel";
>+@import "~bootstrap5/scss/_spinners";
>+@import "~bootstrap5/scss/_offcanvas";
>+@import "~bootstrap5/scss/_placeholders";
> 
> // Helpers
>-@import "../../../../../node_modules/bootstrap5/scss/helpers";
>+@import "~bootstrap5/scss/_helpers";
> 
> // Utilities
>-@import "../../../../../node_modules/bootstrap5/scss/utilities/api";
>+@import "~bootstrap5/scss/utilities/_api";
> // scss-docs-end import-stack
> 
>-@import "mixins";
>-@import "tables";
>-@import "flatpickr";
>-@import "fonts";
>+@import "_mixins";
>+@import "_tables";
>+@import "_flatpickr";
>+@import "_fonts";
> 
> .btn-default {
>     @include button-variant(
>diff --git a/koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss b/koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss
>index b59113e87b..e70db6adc8 100644
>--- a/koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss
>+++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss
>@@ -36,70 +36,69 @@ $high-contrast-grey: #666666;
>     box-shadow: inset 0 1px 1px rgba( 0, 0, 0, .075 ), 0 0 8px rgba( 194, 228, 136, .6 );
> }
> 
>-@import "../../../../../node_modules/bootstrap5/scss/mixins/banner";
>-@include bsBanner("");
>+@import "~bootstrap5/scss/mixins/_banner";
> 
> // scss-docs-start import-stack
> // Configuration
>-@import "../../../../../node_modules/bootstrap5/scss/functions";
>+@import "~bootstrap5/scss/_functions";
> 
> // Include any default variable overrides here
>-@import "variables";
>+@import "_variables";
> 
> // Include remainder of required Bootstrap stylesheets
>-@import "../../../../../node_modules/bootstrap5/scss/variables";
>-@import "../../../../../node_modules/bootstrap5/scss/mixins";
>+@import "~bootstrap5/scss/_variables";
>+@import "~bootstrap5/scss/_mixins";
> 
> $enable-dark-mode: false;
> 
>-@import "../../../../../node_modules/bootstrap5/scss/maps";
>-@import "../../../../../node_modules/bootstrap5/scss/utilities";
>+@import "~bootstrap5/scss/_maps";
>+@import "~bootstrap5/scss/_utilities";
> 
> // Layout & components
>-@import "../../../../../node_modules/bootstrap5/scss/root";
>-@import "../../../../../node_modules/bootstrap5/scss/reboot";
>-@import "../../../../../node_modules/bootstrap5/scss/type";
>-@import "../../../../../node_modules/bootstrap5/scss/images";
>-@import "../../../../../node_modules/bootstrap5/scss/containers";
>-@import "../../../../../node_modules/bootstrap5/scss/grid";
>-@import "../../../../../node_modules/bootstrap5/scss/tables";
>-@import "../../../../../node_modules/bootstrap5/scss/forms";
>-@import "../../../../../node_modules/bootstrap5/scss/buttons";
>-@import "../../../../../node_modules/bootstrap5/scss/transitions";
>-@import "../../../../../node_modules/bootstrap5/scss/dropdown";
>-@import "../../../../../node_modules/bootstrap5/scss/button-group";
>-@import "../../../../../node_modules/bootstrap5/scss/nav";
>-@import "../../../../../node_modules/bootstrap5/scss/navbar";
>-@import "../../../../../node_modules/bootstrap5/scss/card";
>-@import "../../../../../node_modules/bootstrap5/scss/accordion";
>-@import "../../../../../node_modules/bootstrap5/scss/breadcrumb";
>-@import "../../../../../node_modules/bootstrap5/scss/pagination";
>-@import "../../../../../node_modules/bootstrap5/scss/badge";
>-@import "../../../../../node_modules/bootstrap5/scss/alert";
>-@import "../../../../../node_modules/bootstrap5/scss/progress";
>-@import "../../../../../node_modules/bootstrap5/scss/list-group";
>-@import "../../../../../node_modules/bootstrap5/scss/close";
>-@import "../../../../../node_modules/bootstrap5/scss/toasts";
>-@import "../../../../../node_modules/bootstrap5/scss/modal";
>-@import "../../../../../node_modules/bootstrap5/scss/tooltip";
>-@import "../../../../../node_modules/bootstrap5/scss/popover";
>-@import "../../../../../node_modules/bootstrap5/scss/carousel";
>-@import "../../../../../node_modules/bootstrap5/scss/spinners";
>-@import "../../../../../node_modules/bootstrap5/scss/offcanvas";
>-@import "../../../../../node_modules/bootstrap5/scss/placeholders";
>+@import "~bootstrap5/scss/_root";
>+@import "~bootstrap5/scss/_reboot";
>+@import "~bootstrap5/scss/_type";
>+@import "~bootstrap5/scss/_images";
>+@import "~bootstrap5/scss/_containers";
>+@import "~bootstrap5/scss/_grid";
>+@import "~bootstrap5/scss/_tables";
>+@import "~bootstrap5/scss/_forms";
>+@import "~bootstrap5/scss/_buttons";
>+@import "~bootstrap5/scss/_transitions";
>+@import "~bootstrap5/scss/_dropdown";
>+@import "~bootstrap5/scss/_button-group";
>+@import "~bootstrap5/scss/_nav";
>+@import "~bootstrap5/scss/_navbar";
>+@import "~bootstrap5/scss/_card";
>+@import "~bootstrap5/scss/_accordion";
>+@import "~bootstrap5/scss/_breadcrumb";
>+@import "~bootstrap5/scss/_pagination";
>+@import "~bootstrap5/scss/_badge";
>+@import "~bootstrap5/scss/_alert";
>+@import "~bootstrap5/scss/_progress";
>+@import "~bootstrap5/scss/_list-group";
>+@import "~bootstrap5/scss/_close";
>+@import "~bootstrap5/scss/_toasts";
>+@import "~bootstrap5/scss/_modal";
>+@import "~bootstrap5/scss/_tooltip";
>+@import "~bootstrap5/scss/_popover";
>+@import "~bootstrap5/scss/_carousel";
>+@import "~bootstrap5/scss/_spinners";
>+@import "~bootstrap5/scss/_offcanvas";
>+@import "~bootstrap5/scss/_placeholders";
> 
> // Helpers
>-@import "../../../../../node_modules/bootstrap5/scss/helpers";
>+@import "~bootstrap5/scss/_helpers";
> 
> // Utilities
>-@import "../../../../../node_modules/bootstrap5/scss/utilities/api";
>+@import "~bootstrap5/scss/utilities/_api";
> 
> // scss-docs-end import-stack
> 
>-@import "flatpickr";
>+@import "_flatpickr";
> 
> /* Koha imports */
>-@import "fonts";
>+@import "_fonts";
> 
> // Sticky footer styles
> html,
>diff --git a/package.json b/package.json
>index bcc0f18a4f..83f40a22c7 100644
>--- a/package.json
>+++ b/package.json
>@@ -81,6 +81,7 @@
>     "eslint-plugin-prettier": "^5.1.3",
>     "gulp-tap": "^1.0.1",
>     "html-webpack-plugin": "^5.5.0",
>+    "node-sass-tilde-importer": "^1.0.2",
>     "postcss": "^8.4.14",
>     "postcss-selector-parser": "^6.0.10",
>     "stylelint": "^14.9.1",
>diff --git a/yarn.lock b/yarn.lock
>index 691781c886..ff80010c7b 100755
>--- a/yarn.lock
>+++ b/yarn.lock
>@@ -4799,6 +4799,11 @@ find-cache-dir@^3.3.1:
>     make-dir "^3.0.2"
>     pkg-dir "^4.1.0"
> 
>+find-parent-dir@^0.3.0:
>+  version "0.3.1"
>+  resolved "https://registry.yarnpkg.com/find-parent-dir/-/find-parent-dir-0.3.1.tgz#c5c385b96858c3351f95d446cab866cbf9f11125"
>+  integrity sha512-o4UcykWV/XN9wm+jMEtWLPlV8RXCZnMhQI6F6OdHeSez7iiJWePw8ijOlskJZMsaQoGR/b7dH6lO02HhaTN7+A==
>+
> find-up@^1.0.0:
>   version "1.1.2"
>   resolved "https://registry.yarnpkg.com/find-up/-/find-up-1.1.2.tgz#6b2e9822b1a2ce0a60ab64d610eccad53cb24d0f"
>@@ -7366,6 +7371,13 @@ node-releases@^2.0.6:
>   resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.6.tgz#8a7088c63a55e493845683ebf3c828d8c51c5503"
>   integrity sha512-PiVXnNuFm5+iYkLBNeq5211hvO38y63T0i2KKh2KnUs3RpzJ+JtODFjkD8yjLwnDkTYF1eKXheUwdssR+NRZdg==
> 
>+node-sass-tilde-importer@^1.0.2:
>+  version "1.0.2"
>+  resolved "https://registry.yarnpkg.com/node-sass-tilde-importer/-/node-sass-tilde-importer-1.0.2.tgz#1a15105c153f648323b4347693fdb0f331bad1ce"
>+  integrity sha512-Swcmr38Y7uB78itQeBm3mThjxBy9/Ah/ykPIaURY/L6Nec9AyRoL/jJ7ECfMR+oZeCTVQNxVMu/aHU+TLRVbdg==
>+  dependencies:
>+    find-parent-dir "^0.3.0"
>+
> nomnom@1.8.1:
>   version "1.8.1"
>   resolved "https://registry.yarnpkg.com/nomnom/-/nomnom-1.8.1.tgz#2151f722472ba79e50a76fc125bb8c8f2e4dc2a7"
>-- 
>2.46.0

Actions: View | Diff | Splinter Review

Attachments on bug 35402: 170651 | 170709 | 170710 | 170711 | 170712 | 170714 | 170715 | 170716 | 170717 | 170745 | 170768 | 170877 | 170905 | 170962 | 170963 | 171176