Good morning, I recently updated frontend stuff and now receiving on frontend:zed:build > ● webpa

UPWG9AYH2

Good morning,
I recently updated frontend stuff and now receiving on frontend:zed:build

● webpack output:

ERROR in ./vendor/spryker/gui/assets/Zed/sass/main.scss
Module build failed (from ./node_modules/@spryker/oryx-for-zed/node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleBuildError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Undefined function.
╷
369 │ $navbar-padding-horizontal: floor(math.div($grid-gutter-width, 2)) !default;
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
vendor/spryker/gui/assets/Zed/node_modules/bootstrap-sass/assets/stylesheets/bootstrap/_variables.scss 369:42 @import
vendor/spryker/gui/assets/Zed/node_modules/bootstrap-sass/assets/stylesheets/_bootstrap.scss 8:9 @import
vendor/spryker/gui/assets/Zed/sass/main.scss 11:9 root stylesheet
at /data/node_modules/@spryker/oryx-for-zed/node_modules/webpack/lib/NormalModule.js:316:20
at /data/node_modules/loader-runner/lib/LoaderRunner.js:367:11
at /data/node_modules/loader-runner/lib/LoaderRunner.js:233:18
at context.callback (/data/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
at /data/node_modules/sass-loader/dist/index.js:62:7
at Function.call$2 (/data/node_modules/sass/sass.dart.js:92646:16)
at _render_closure1.call$2 (/data/node_modules/sass/sass.dart.js:81147:12)
at _RootZone.runBinary$3$3 (/data/node_modules/sass/sass.dart.js:27268:18)
at _FutureListener.handleError$1 (/data/node_modules/sass/sass.dart.js:25818:19)
at _Future__propagateToListeners_handleError.call$0 (/data/node_modules/sass/sass.dart.js:26116:49)
@ ./vendor/spryker/gui/assets/Zed/js/modules/commons.js 74:0-31
@ ./vendor/spryker/gui/assets/Zed/js/spryker-zed-gui-commons.entry.js

ERROR in ./vendor/spryker/gui/assets/Zed/node_modules/summernote/dist/summernote.js
Module not found: Error: Can’t resolve ‘jQuery’ in ‘/data/vendor/spryker/gui/assets/Zed/node_modules/summernote/dist’
@ ./vendor/spryker/gui/assets/Zed/node_modules/summernote/dist/summernote.js 15:27-44
@ ./vendor/spryker/gui/assets/Zed/js/modules/commons.js
@ ./vendor/spryker/gui/assets/Zed/js/spryker-zed-gui-commons.entry.js
✘ build failed

Anyone faced this issue too?

Best regards

giovanni.piemontese

Hi Ingo, yes... maybe u don't have more the frontend:zed:install-dependencies right?
Then u have to make some change to your package.json

giovanni.piemontese

let me know if it is your case

UPWG9AYH2

Yes i think thats the case since its gonna replaced by a common command, right?

UPWG9AYH2

frontend:project:install-dependencies

giovanni.piemontese

in case this is so, then u have to update your package.json on root level with this data

    "workspaces": [
        "vendor/spryker/*",
        "vendor/spryker/*/assets/Zed"
    ],

and then it should enough to call frontend:project:install-dependencies to build yves and in your case zed/backoffice

UPWG9AYH2

i called, but doesn’t seem to be enough

giovanni.piemontese

did u updated the package.json on root?

giovanni.piemontese

u need to put workspace.. but !!!! -> only node >=16 and npm >= 8 otherwise u have to call the deprecated zed install dependecies

giovanni.piemontese

https://docs.npmjs.com/cli/v7/using-npm/workspaces

UPWG9AYH2

i see there are some errors on the dependency install

UPWG9AYH2

Install Project dependencies
[info] npm
[info] WARN prepare removing existing node_modules/ before installation

[info]

core-js@3.4.8 postinstall /data/node_modules/core-js
node -e “try{require(‘./postinstall’)}catch(e){}”

[info]

fsevents@1.2.13 install /data/node_modules/watchpack-chokidar2/node_modules/fsevents
node install.js

[info]

[info] Skipping ‘fsevents’ build as platform linux is not supported

[info]

iltorb@2.4.5 install /data/node_modules/iltorb
node ./scripts/install.js || node-gyp rebuild

[info] info
[info] looking for cached prebuild @ /home/spryker/.npm/_cacache/_prebuilds/2d4b78-iltorb-v2.4.5-node-v72-linux-arm64.tar.gz

[info] http request GET https://github.com/nstepien/iltorb/releases/download/v2.4.5/iltorb-v2.4.5-node-v72-linux-arm64.tar.gz

[info] http 404 https://github.com/nstepien/iltorb/releases/download/v2.4.5/iltorb-v2.4.5-node-v72-linux-arm64.tar.gz

[info] WARN install No prebuilt binaries found (target=12.22.12 runtime=node arch=arm64 libc= platform=linux)

[info] make: Entering directory ‘/data/node_modules/iltorb/build’

[info] CC(target) Release/obj.target/iltorb/brotli/c/common/dictionary.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/common/transform.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/dec/bit_reader.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/dec/decode.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/dec/huffman.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/dec/state.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/backward_references.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/backward_references_hq.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/bit_cost.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/block_splitter.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/brotli_bit_stream.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/cluster.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/compress_fragment.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/compress_fragment_two_pass.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/dictionary_hash.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/encode.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/encoder_dict.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/entropy_encode.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/histogram.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/literal_cost.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/memory.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/metablock.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/static_dict.o

[info] CC(target) Release/obj.target/iltorb/brotli/c/enc/utf8_util.o

[info] CXX(target) Release/obj.target/iltorb/src/common/allocator.o

[info] CXX(target) Release/obj.target/iltorb/src/common/stream_coder.o

[info] CXX(target) Release/obj.target/iltorb/src/dec/stream_decode.o

[info] CXX(target) Release/obj.target/iltorb/src/dec/stream_decode_worker.o

[info] CXX(target) Release/obj.target/iltorb/src/enc/stream_encode.o

[info] CXX(target) Release/obj.target/iltorb/src/enc/stream_encode_worker.o

[info] CXX(target) Release/obj.target/iltorb/src/iltorb.o

[info] In file included from ../../nan/nan.h:58,
from ../src/iltorb.cc:1:
/home/spryker/.cache/node-gyp/12.22.12/include/node/node.h:756:7: warning: cast between incompatible function types from ‘void ()(v8::Local, v8::Local, v8::Local)’ to ‘node::addon_context_register_func’ {aka ‘void ()(v8::Local, v8::Local, v8::Local, void*)‘} [-Wcast-function-type]
756 | (node::addon_context_register_func) (regfunc), \
| ^~~~~~~~~~~~~
/home/spryker/.cache/node-gyp/12.22.12/include/node/node.h:774:3: note: in expansion of macro ‘NODE_MODULE_CONTEXT_AWARE_X’
774 | NODE_MODULE_CONTEXT_AWARE_X(modname, regfunc, NULL, 0)
| ^~~~~~~
/home/spryker/.cache/node-gyp/12.22.12/include/node/node.h:805:3: note: in expansion of macro ‘NODE_MODULE_CONTEXT_AWARE’
805 | NODE_MODULE_CONTEXT_AWARE(NODE_GYP_MODULE_NAME, \
| ^~~~~~~~~
../src/iltorb.cc:8:1: note: in expansion of macro ‘NODE_MODULE_INIT’
8 | NODE_MODULE_INIT() {
| ^~~~

[info] SOLINK_MODULE(target) Release/obj.target/iltorb.node

[info] COPY Release/iltorb.node

[info] COPY ../build/bindings/iltorb.node

[info] TOUCH Release/obj.target/action_after_build.stamp

[info] make: Leaving directory ‘/data/node_modules/iltorb/build’

[info] added 1315 packages in 19.76s

UPWG9AYH2

Seems to be M1 problem (?)

UPWG9AYH2

"engines": {
  "node": ">=12.0.0"
},

giovanni.piemontese

update node to version 16 and try again.. do u have the latest oryx-for-zed too?

UPWG9AYH2

"@spryker/oryx-for-zed": "~2.11.5",

giovanni.piemontese

try to update to 2.12.0

UPWG9AYH2

with npm 16 and node 8 even more errors but on npm install

UPWG9AYH2

Install Project dependencies
[info] npm ERR! code EUSAGE

[info] npm ERR!
npm ERR! npm ci can only install packages when your package.json and package-lock.json or npm-shrinkwrap.json are in sync. Please update your lock file with npm install before continuing.
npm
[info] ERR!
npm ERR! Missing: eslint@8.23.1 from lock file
npm ERR!
[info] Missing: @eslint/eslintrc@1.3.2 from lock file
npm ERR! Missing: @humanwhocodes/config-array@0.10.5 from lock file
npm ERR!
[info] Missing: @humanwhocodes/gitignore-to-minimatch@1.0.2 from lock file
npm ERR! Missing: @humanwhocodes/module-importer@1.0.1 from lock file

[info] npm
[info] ERR! Missing: chalk@4.1.2 from lock file
npm ERR! Missing: cross-spawn@7.0.3 from lock file
npm ERR! Missing: doctrine@3.0.0 from lock file
npm ERR! Missing: escape-string-regexp@4.0.0 from lock file
npm ERR! Missing: eslint-scope@7.1.1 from lock file
npm ERR! Missing: eslint-utils@3.0.0 from lock file
npm ERR! Missing: eslint-visitor-keys@3.3.0 from lock file
npm ERR! Missing: espree@9.4.0 from lock file
npm ERR! Missing: esquery@1.4.0 from lock file
npm ERR! Missing: find-up@5.0.0 from lock file
npm ERR! Missing: glob-parent@6.0.2 from lock file
npm ERR! Missing: globals@13.17.0 from lock file
npm ERR! Missing: globby@11.1.0 from lock file
npm ERR! Missing: grapheme-splitter@1.0.4 from lock file
npm ERR! Missing: ignore@5.2.0 from lock file
npm ERR! Missing: import-fresh@3.3.0 from lock file
npm ERR! Missing: js-sdsl@4.1.4 from lock file
npm ERR!
[info] Missing: js-yaml@4.1.0 from lock file
npm ERR! Missing: json-stable-stringify-without-jsonify@1.0.1 from lock file
npm ERR! Missing: levn@0.4.1 from lock file
npm ERR! Missing: lodash.merge@4.6.2 from lock file
npm ERR! Missing: natural-compare@1.4.0 from lock file
npm ERR! Missing: optionator@0.9.1 from lock file
npm ERR! Missing: regexpp@3.2.0 from lock file
npm ERR! Missing: strip-ansi@6.0.1 from lock file
npm ERR! Missing: strip-json-comments@3.1.1 from lock file
npm ERR! Missing: text-table@0.2.0 from lock file
npm ERR! Missing: globals@13.17.0 from lock file
npm ERR! Missing: ignore@5.2.0 from lock file
npm ERR! Missing: import-fresh@3.3.0 from lock file
npm ERR! Missing: js-yaml@4.1.0 from lock file
npm ERR! Missing: strip-json-comments@3.1.1 from lock file
npm
[info] ERR! Missing: @humanwhocodes/object-schema@1.2.1 from lock file
npm ERR! Missing: path-key@3.1.1 from lock file
npm ERR! Missing: shebang-command@2.0.0 from lock file
npm ERR! Missing: which@2.0.2 from lock file
npm ERR! Missing: eslint-visitor-keys@2.1.0 from lock file
npm ERR! Missing: acorn-jsx@5.3.2 from lock file
npm ERR! Missing: eslint-visitor-keys@3.3.0 from lock file
npm ERR! Missing: estraverse@5.3.0 from lock file
npm ERR! Missing: prelude-ls@1.2.1 from lock file
npm ERR! Missing: type-check@0.4.0 from lock file
npm ERR! Missing: deep-is@0.1.4 from lock file
npm ERR! Missing: fast-levenshtein@2.0.6 from lock file
npm ERR! Missing: word-wrap@1.2.3 from lock file
npm ERR! Missing: type-fest@0.20.2 from lock file
npm ERR! Missing: resolve-from@4.0.0 from lock file
npm ERR! Missing: argparse@2.0.1 from lock file
npm ERR! Missing: shebang-regex@3.0.0 from lock file
npm ERR! Missing: ansi-styles@4.3.0 from lock file
npm ERR!
[info] Missing: supports-color@7.2.0 from lock file
npm ERR! Missing: color-convert@2.0.1 from lock file
npm ERR! Missing: color-name@1.1.4 from lock file
npm
[info] ERR! Missing: estraverse@5.3.0 from lock file
npm
[info] ERR! Missing: locate-path@6.0.0 from lock file
npm ERR! Missing: path-exists@4.0.0 from lock file
npm
[info] ERR! Missing: type-fest@0.20.2 from lock file
npm ERR! Missing: array-union@2.1.0 from lock file
npm ERR!
[info] Missing: dir-glob@3.0.1 from lock file
npm ERR!
[info] Missing: fast-glob@3.2.12 from lock file
npm ERR!
[info] Missing: slash@3.0.0 from lock file
npm ERR! Missing: path-type@4.0.0 from lock file
npm ERR!
[info] Missing: @nodelib/fs.stat@2.0.5 from lock file
npm ERR!
[info] Missing: glob-parent@5.1.2 from lock file
npm ERR!
[info] Missing: micromatch@4.0.5 from lock file
npm
[info] ERR! Missing: resolve-from@4.0.0 from lock file
npm
[info] ERR! Missing: argparse@2.0.1 from lock file

[info] npm ERR! Missing: p-locate@5.0.0 from lock file
npm ERR! Missing: braces@3.0.2 from lock file
npm ERR! Missing: fill-range@7.0.1 from lock file
npm ERR! Missing: to-regex-range@5.0.1 from lock file
npm ERR! Missing: p-limit@3.1.0 from lock file
npm ERR! Missing: ansi-regex@5.0.1 from lock file
npm ERR! Missing: has-flag@4.0.0 from lock file
npm ERR! Missing: is-number@7.0.0 from lock file
npm ERR!
npm ERR! Clean install a project
npm ERR!
npm ERR! Usage:
npm ERR! npm ci
npm ERR!
[info]
npm ERR! Options:
npm ERR! [-S|--save|--no-save|--save-prod|--save-dev|--save-optional|--save-peer|--save-bundle]
npm ERR! [-E|--save-exact] [-g|--global] [--global-style] [--legacy-bundling]
npm ERR! [--omit <dev|optional|peer> [--omit <dev|optional|peer> ...]]
npm ERR! [--strict-peer-deps] [--no-package-lock] [--foreground-scripts]
npm ERR! [--ignore-scripts] [--no-audit] [--no-bin-links] [--no-fund] [--dry-run]
npm ERR! [-w|--workspace [-w|--workspace ...]]
npm ERR! [-ws|--workspaces] [--include-workspace-root] [--install-links]
npm ERR!
npm ERR! aliases: clean-install, ic, install-clean, isntall-clean
npm
[info] ERR!
npm ERR! Run “npm help ci” for more info

[info]

giovanni.piemontese

smth is strange.. let us maybe have a call..

U03EDGXUTPH

Hi @UPWG9AYH2, did you get this sorted out? I have a similar issue now.

UPWG9AYH2

Hi Victor. We kinda worked around this. We updated to the versions of node/npm Giovanni suggested and deleted package-lock.json and did npm install again … but also on our side, the command frontend:project:install-dependencies does not work and throwing errors … so we are using the dedicated and deprecated zed/yves command which works …

U03EDGXUTPH

Thanks! I will try and see what can we do then 🙂

giovanni.piemontese

Try to define in deploy yml recipe the node version too

    node:
        version: 16
        npm: 8

and in package json

    "workspaces": [
        "vendor/spryker/*",
        "vendor/spryker/*/assets/Zed",
    ],

then u don't need anymore to run the deprecated zed/yves install commands