Expand my Community achievements bar.

Applications for the 2024-2025 Adobe Experience Manager Champion Program are open!
Apply Here Now
SOLVED

WKND tutorial issue: no files generated in clientlibs when I execute npm run watch in ui.frontend folder

Avatar

Level 2
Level 2
6/21/23 6:55:51 AM

I am new to AEM, and try to use official tutorial WKND for learning, in component basic page I get a blocker in "Client-Side Libraries" section, link below FYI

https://experienceleague.adobe.com/docs/experience-manager-learn/getting-started-wknd-tutorial-devel...

when I do some changes per as tutorial asked in ui.frontend folder and execute "npm run watch", the log in my terminal is different from tutorial, there is not any files generated in "ui.frontend/dist" folder or "ui.apps/.../clientlibs/clientlib-site/", so what steps am I missing?

james ui.frontend % npm run watch                 

> aem-maven-archetype@1.0.0 watch /Users/james/htdocs/aem-code/forest-wknd/ui.frontend
> npm-run-all --parallel start chokidar aemsyncro

> aem-maven-archetype@1.0.0 start /Users/james/htdocs/aem-code/forest-wknd/ui.frontend
> webpack-dev-server --open --config ./webpack.dev.js

> aem-maven-archetype@1.0.0 aemsyncro /Users/james/htdocs/aem-code/forest-wknd/ui.frontend
> aemsync -w ../ui.apps/src/main/content

> aem-maven-archetype@1.0.0 chokidar /Users/james/htdocs/aem-code/forest-wknd/ui.frontend
> chokidar -c "clientlib" ./dist

aemsync version 4.0.3

    Watch over: /Users/james/htdocs/aem-code/forest-wknd/ui.apps/src/main/content
       Targets: http://admin:admin@localhost:4502
       Exclude: **/jcr_root/*
                **/@(.git|.svn|.hg|target)
                **/@(.git|.svn|.hg|target)/**
      Interval: 300
  
Watching "./dist" ..
<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.2.16:8081/
<i> [webpack-dev-server] On Your Network (IPv6): http://[fe80::1]:8081/
<i> [webpack-dev-server] Content not from webpack is served from '/Users/james/htdocs/aem-code/forest-wknd/ui.frontend/public' directory
<i> [webpack-dev-middleware] wait until bundle finished: /
assets by chunk 235 KiB (name: site)
  asset clientlib-site/site.css 8.45 KiB [emitted] (name: site)
  asset clientlib-site/site.js 226 KiB [emitted] (name: site)
asset clientlib-site/fonts/.gitkeep 1 bytes [emitted] [from: src/main/webpack/resources/fonts/.gitkeep] [copied]
asset clientlib-site/images/.gitkeep 1 bytes [emitted] [from: src/main/webpack/resources/images/.gitkeep] [copied]
asset index.html 8.52 KiB [emitted]
Entrypoint site 235 KiB = clientlib-site/site.css 8.45 KiB clientlib-site/site.js 226 KiB

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 (/Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/webpack/lib/NormalModule.js:601:16)
    at /Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/glob-import-loader/index.js:60:24
    at finishWithoutResolve (/Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/enhanced-resolve/lib/Resolver.js:372:11)
    at /Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/enhanced-resolve/lib/Resolver.js:461:15
    at /Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/enhanced-resolve/lib/Resolver.js:519:5
    at eval (eval at create (/Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
    at /Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/enhanced-resolve/lib/Resolver.js:519:5
    at eval (eval at create (/Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:27:1)
    at /Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:89:43
    at /Users/james/htdocs/aem-code/forest-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) 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 (/Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/webpack/lib/NormalModule.js:601:16)
    at /Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/glob-import-loader/index.js:60:24
    at finishWithoutResolve (/Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/enhanced-resolve/lib/Resolver.js:372:11)
    at /Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/enhanced-resolve/lib/Resolver.js:461:15
    at /Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/enhanced-resolve/lib/Resolver.js:519:5
    at eval (eval at create (/Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
    at /Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/enhanced-resolve/lib/Resolver.js:519:5
    at eval (eval at create (/Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:27:1)
    at /Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:89:43
    at /Users/james/htdocs/aem-code/forest-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 (/Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/webpack/lib/NormalModule.js:601:16)
    at /Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/glob-import-loader/index.js:119:16
    at processTicksAndRejections (internal/process/task_queues.js:95:5)
    at async Promise.all (index 1)
    at async Object.module.exports (/Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/glob-import-loader/index.js:80:25)

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 "./**/*.ts""
NonErrorEmittedError: (Emitted value instead of an instance of Error) Empty results for "import "./**/*.ts""
    at Object.emitWarning (/Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/webpack/lib/NormalModule.js:601:16)
    at /Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/glob-import-loader/index.js:119:16
    at processTicksAndRejections (internal/process/task_queues.js:95:5)
    at async Promise.all (index 2)
    at async Object.module.exports (/Users/james/htdocs/aem-code/forest-wknd/ui.frontend/node_modules/glob-import-loader/index.js:80:25)

2023-06-21 21:30:30: webpack 5.86.0 compiled with 4 warnings in 7803 ms

 

Views

1.5K

Replies

5
Sign in to like this content

Total Likes

Translate
Translate
1 Accepted Solution

Avatar

Correct answer by
Community Advisor
Community Advisor
6/21/23 7:27:01 AM

Hi @James_shan , Can you try to comment or remove those imports from 2 imports from main.ts file and try to build again 
aem-guides-wknd\ui.frontend\src\main\webpack\site\main.ts

  1. import "./**/*.js";
  2. import "./**/*.ts";

Generally npm run watch will automatically compile when it detects changes but if it doesn't work you can use npm run dev which needs to be run when ever you make changes manually unlike watch command.

 

Hope this helps,

Krishna

View solution in original post

Views

1.4K

Replies

4
Sign in to like this content

Total Likes

Translate
Translate
Jump to reply
5 Replies

Avatar

Correct answer by
Community Advisor
Community Advisor
6/21/23 7:27:01 AM

Hi @James_shan , Can you try to comment or remove those imports from 2 imports from main.ts file and try to build again 
aem-guides-wknd\ui.frontend\src\main\webpack\site\main.ts

  1. import "./**/*.js";
  2. import "./**/*.ts";

Generally npm run watch will automatically compile when it detects changes but if it doesn't work you can use npm run dev which needs to be run when ever you make changes manually unlike watch command.

 

Hope this helps,

Krishna

Views

1.4K

Replies

4
Sign in to like this content

Total Likes

Translate
Translate
Jump to reply

Avatar

Level 2
Level 2
6/28/23 1:37:07 AM
In response to krishna_sai

this doesn't resolve my issue, I am considering if it caused by the AEM version or npm-run-all version?

Views

1.4K

Replies

0
Sign in to like this content

Total Likes

Translate
Translate

Avatar

Level 2
Level 2
10/4/23 3:47:46 AM
In response to krishna_sai

I am facing the exact same problem, commenting the below imports didn't work for me. 

  1. import "./**/*.js";
  2. import "./**/*.ts";

Any solution on this ?

Views

1.1K

Replies

2
Sign in to like this content

Total Likes

Translate
Translate

Avatar

Level 1
Level 1
10/13/23 7:36:56 AM
In response to sukghosa

Hi @sukghosa ,

 

I had a similar issue with another project. I changed the watch script in the package.json as follows:

"watch": "webpack-dev-server --config ./webpack.dev.js --env writeToDisk & chokidar -c \"clientlib\" ./dist & aemsync -w ../ui.apps/src/main/content"

 

I hope this was helpful to you! 

cc @James_shan 

Best,
Milen

Views

1.1K

Replies

1
Sign in to like this content

Total Likes

Translate
Translate
Related Conversations
How to write a xpath query to check all the title properties in metadata node of an asset

Views

79

Likes

0

Replies

4
Multi tenancy in shared AEM cloud Environment

Views

54

Likes

0

Replies

2
Replication through code in AEM as cloud service

Views

67

Likes

0

Replies

1
Page move action in AEM 6.5.15

Views

71

Likes

0

Replies

2
Product in AEM

Views

85

Likes

0

Replies

3