Hi, guys.
I am following the guidelines:
Client libraries and front-end workflow | Adobe Experience Manager
when I use npm run watch or npm run dev I receive the following error output:
PS C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend> npm run watch
> aem-maven-archetype@1.0.0 watch
> webpack-dev-server --config ./webpack.dev.js --env writeToDisk & chokidar -c "clientlib" ./dist & aemsync -w ../ui.apps/src/main/content
<i> [webpack-dev-server] [HPM] Proxy created: /content,/etc.clientlibs -> http://localhost:4502
<i> [webpack-dev-server] Project is running at:
<i> [webpack-dev-server] Loopback: http://localhost:8081/
<i> [webpack-dev-server] On Your Network (IPv4): http://192.168.15.8:8081/
<i> [webpack-dev-server] On Your Network (IPv6): http://[fe80::b38d:cb74:7b3c:27b3]:8081/
<i> [webpack-dev-server] Content not from webpack is served from 'C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\public' directory
assets by path clientlib-site/fonts/ 22.4 KiB
asset clientlib-site/fonts/.gitkeep 1 bytes [emitted] [from: src/main/webpack/resources/fonts/.gitkeep] [copied]
asset clientlib-site/fonts/wknd-icon-font.svg 12.6 KiB [emitted] [from: src/main/webpack/resources/fonts/wknd-icon-font.svg] [copied]
asset clientlib-site/fonts/wknd-icon-font.ttf 4.88 KiB [emitted] [from: src/main/webpack/resources/fonts/wknd-icon-font.ttf] [copied]
asset clientlib-site/fonts/wknd-icon-font.woff 4.95 KiB [emitted] [from: src/main/webpack/resources/fonts/wknd-icon-font.woff] [copied]
asset clientlib-site/images/.gitkeep 1 bytes [emitted] [from: src/main/webpack/resources/images/.gitkeep] [copied]
asset clientlib-site/site.js 208 KiB [emitted] (name: site)
asset index.html 33.9 KiB [emitted]
Entrypoint site 208 KiB = clientlib-site/site.js
WARNING in ./src/main/webpack/site/main.ts
Module Warning (from ./node_modules/glob-import-loader/index.js):
(Emitted value instead of an instance of Error) Could not find any files that matched the wildcard path.
NonErrorEmittedError: (Emitted value instead of an instance of Error) Could not find any files that matched the wildcard path.
at Object.emitWarning (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\webpack\lib\NormalModule.js:601:16)
at C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\glob-import-loader\index.js:60:24
at finishWithoutResolve (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\enhanced-resolve\lib\Resolver.js:372:11)
at C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\enhanced-resolve\lib\Resolver.js:461:15
at C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\enhanced-resolve\lib\Resolver.js:519:5
at eval (eval at create (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
at C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\enhanced-resolve\lib\Resolver.js:519:5
at eval (eval at create (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:27:1)
at C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\enhanced-resolve\lib\DescriptionFilePlugin.js:89:43
at C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\enhanced-resolve\lib\Resolver.js:519:5
WARNING in ./src/main/webpack/site/main.ts
Module Warning (from ./node_modules/glob-import-loader/index.js):
(Emitted value instead of an instance of Error) Empty results for "import "./**/*.js""
NonErrorEmittedError: (Emitted value instead of an instance of Error) Empty results for "import "./**/*.js""
at Object.emitWarning (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\webpack\lib\NormalModule.js:601:16)
at C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\glob-import-loader\index.js:119:16
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async Promise.all (index 1)
at async module.exports (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\glob-import-loader\index.js:80:25)
ERROR in ./src/main/webpack/site/main.scss (./src/main/webpack/site/main.scss.webpack[javascript/auto]!=!./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/sass-loader/dist/cjs.js!./node_modules/glob-import-loader/index.js??ruleSet[1].rules[1].use[4]!./src/main/webpack/site/main.scss)
Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: There is no module with the namespace "math".
╷
23 │ margin-top: math.div($gutter-padding, 2);
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
src\main\webpack\components\_image.scss 23:21 @Import
src\main\webpack\site\main.scss 5:1782 root stylesheet
SassError: SassError: There is no module with the namespace "math".
╷
23 │ margin-top: math.div($gutter-padding, 2);
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
src\main\webpack\components\_image.scss 23:21 @Import
src\main\webpack\site\main.scss 5:1782 root stylesheet
at Object.loader (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\sass-loader\dist\index.js:69:14)
@ ./src/main/webpack/site/main.scss
@ ./src/main/webpack/site/main.ts 1:0-21
ERROR in ./src/main/webpack/site/main.scss
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
HookWebpackError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: There is no module with the namespace "math".
╷
23 │ margin-top: math.div($gutter-padding, 2);
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
src\main\webpack\components\_image.scss 23:21 @Import
src\main\webpack\site\main.scss 5:1782 root stylesheet
at tryRunOrWebpackError (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\webpack\lib\HookWebpackError.js:88:9)
at __webpack_require_module__ (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\webpack\lib\Compilation.js:5067:12)
at __webpack_require__ (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\webpack\lib\Compilation.js:5024:18)
at C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\webpack\lib\Compilation.js:5095:20
at symbolIterator (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\neo-async\async.js:3485:9)
at done (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\neo-async\async.js:3527:9)
at Hook.eval [as callAsync] (eval at create (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\tapable\lib\Hook.js:18:14)
at C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\webpack\lib\Compilation.js:5002:43
at symbolIterator (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\neo-async\async.js:3482:9)
-- inner error --
Error: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: There is no module with the namespace "math".
╷
23 │ margin-top: math.div($gutter-padding, 2);
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
src\main\webpack\components\_image.scss 23:21 @Import
src\main\webpack\site\main.scss 5:1782 root stylesheet
at Object.<anonymous> (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\css-loader\dist\cjs.js??ruleSet[1].rules[1].use[1]!C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\postcss-loader\dist\cjs.js??ruleSet[1].rules[1].use[2]!C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\sass-loader\dist\cjs.js!C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\glob-import-loader\index.js??ruleSet[1].rules[1].use[4]!C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\src\main\webpack\site\main.scss:1:7)
at C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\webpack\lib\javascript\JavascriptModulesPlugin.js:452:10
at Hook.eval [as call] (eval at create (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\tapable\lib\HookCodeFactory.js:19:10), <anonymous>:7:1)
at Hook.CALL_DELEGATE [as _call] (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\tapable\lib\Hook.js:14:14)
at C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\webpack\lib\Compilation.js:5069:39
at tryRunOrWebpackError (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\webpack\lib\HookWebpackError.js:83:7)
at __webpack_require_module__ (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\webpack\lib\Compilation.js:5067:12)
at __webpack_require__ (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\webpack\lib\Compilation.js:5024:18)
at C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\webpack\lib\Compilation.js:5095:20
at symbolIterator (C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\neo-async\async.js:3485:9)
Generated code for C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\css-loader\dist\cjs.js??ruleSet[1].rules[1].use[1]!C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\postcss-loader\dist\cjs.js??ruleSet[1].rules[1].use[2]!C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\sass-loader\dist\cjs.js!C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\node_modules\glob-import-loader\index.js??ruleSet[1].rules[1].use[4]!C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend\src\main\webpack\site\main.scss
1 | throw new Error("Module build failed (from ./node_modules/sass-loader/dist/cjs.js):\nSassError: There is no module with the namespace \"math\".\n ╷\n23 │ margin-top: math.div($gutter-padding, 2);\n │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^\n ╵\n src\\main\\webpack\\components\\_image.scss 23:21 @Import\n src\\main\\webpack\\site\\main.scss 5:1782 root stylesheet");
@ ./src/main/webpack/site/main.ts 1:0-21
2023-10-03 18:57:55: webpack 5.88.2 compiled with 2 errors and 2 warnings in 3091 ms
<i> [webpack-dev-server] Gracefully shutting down. To force exit, press ^C again. Please wait...
Terminate batch job (Y/N)? y
Terminate batch job (Y/N)? y
PS C:\Users\pc\aem-sdk\code\tutorial\aem-guides-wknd\ui.frontend>
##########################################################
It looks that the error starts here:
WARNING in ./src/main/webpack/site/main.ts
Module Warning (from ./node_modules/glob-import-loader/index.js):
(Emitted value instead of an instance of Error) Could not find any files that matched the wildcard path.
NonErrorEmittedError: (Emitted value instead of an instance of Error) Could not find any files that matched the wildcard path.
at Object.emitWarning (/mnt/c/Users/pc/aem-sdk/code/tutorial/aem-guides-wknd/ui.frontend/node_modules/webpack/lib/NormalModule.js:601:16)
at /mnt/c/Users/pc/aem-sdk/code/tutorial/aem-guides-wknd/ui.frontend/node_modules/glob-import-loader/index.js:60:24
at finishWithoutResolve (/mnt/c/Users/pc/aem-sdk/code/tutorial/aem-guides-wknd/ui.frontend/node_modules/enhanced-resolve/lib/Resolver.js:372:11)
at /mnt/c/Users/pc/aem-sdk/code/tutorial/aem-guides-wknd/ui.frontend/node_modules/enhanced-resolve/lib/Resolver.js:461:15
at /mnt/c/Users/pc/aem-sdk/code/tutorial/aem-guides-wknd/ui.frontend/node_modules/enhanced-resolve/lib/Resolver.js:519:5
at eval (eval at create (/mnt/c/Users/pc/aem-sdk/code/tutorial/aem-guides-wknd/ui.frontend/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
at /mnt/c/Users/pc/aem-sdk/code/tutorial/aem-guides-wknd/ui.frontend/node_modules/enhanced-resolve/lib/Resolver.js:519:5
at eval (eval at create (/mnt/c/Users/pc/aem-sdk/code/tutorial/aem-guides-wknd/ui.frontend/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:27:1)
at /mnt/c/Users/pc/aem-sdk/code/tutorial/aem-guides-wknd/ui.frontend/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:89:43
at /mnt/c/Users/pc/aem-sdk/code/tutorial/aem-guides-wknd/ui.frontend/node_modules/enhanced-resolve/lib/Resolver.js:519:5.
and then I receive errors like this:
ERROR in ./src/main/webpack/site/main.scss (./src/main/webpack/site/main.scss.webpack[javascript/auto]!=!./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/sass-loader/dist/cjs.js!./node_modules/glob-import-loader/index.js??ruleSet[1].rules[1].use[4]!./src/main/webpack/site/main.scss)
Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: There is no module with the namespace "math".
╷
23 │ margin-top: math.div($gutter-padding, 2);
Can anyone help here?
