Question
WKND client side libraries npm run watch issues
Hello, I'm trying to follow the WKND tutorial however I am having issues with the client side libraries section. When I use npm run watch I get the following output and my changes aren't reflected in AEM:
\Documents\aem-sdk\code\aem-guides-wknd\ui.frontend>npm run watch
> aem-wknd-theme@1.0.0 watch
> webpack-dev-server --config ./webpack.dev.js --env writeToDisk & chokidar -c "clientlib" ./dist & aemsync -w ../ui.apps/src/main/content
Browserslist: caniuse-lite is outdated. Please run:
npx browserslist@latest --update-db
Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
<i> [webpack-dev-server] [HPM] Proxy created: /content,/etc.clientlibs,/libs -> http://localhost:4502
<i> [webpack-dev-server] Project is running at:
<i> [webpack-dev-server] Loopback: http://localhost:8080/
<i> [webpack-dev-server] On Your Network (IPv4): http://10.0.0.43:8080/
<i> [webpack-dev-server] Content not from webpack is served from '\aem-sdk\code\aem-guides-wknd\ui.frontend\public' directory
assets by path clientlib-site/images/ 364 KiB
assets by path clientlib-site/images/country-flags/*.svg 336 KiB 7 assets
assets by path clientlib-site/images/favicons/*.png 26.6 KiB 7 assets
asset clientlib-site/images/loading-icon.svg 659 bytes [emitted] [from: src/main/webpack/resources/images/loading-icon.svg] [copied]
assets by path clientlib-site/fonts/ 22.5 KiB
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]
assets by path clientlib-site/js/*.js 570 KiB
asset clientlib-site/js/site.bundle.js 54.4 KiB [emitted] (name: site)
asset clientlib-site/js/vendors-node_modules_jquery_dist_jquery_js-node_modules_webpack-dev-server_client_index_js_pr-fcbd70.bundle.js 516 KiB [emitted] (id hint: vendors)
asset clientlib-site/manifest.json 1.48 KiB [emitted] [from: src/main/webpack/resources/manifest.json] [copied]
asset clientlib-site/site.css 362 KiB [emitted] (name: site)
asset index.html 72.2 KiB [emitted]
Entrypoint site 933 KiB = clientlib-site/js/vendors-node_modules_jquery_dist_jquery_js-node_modules_webpack-dev-server_client_index_js_pr-fcbd70.bundle.js 516 KiB clientlib-site/site.css 362 KiB clientlib-site/js/site.bundle.js 54.4 KiB
LOG from ./node_modules/sass-loader/dist/cjs.js sass-loader ./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
<w> Deprecation Using / for division outside of calc() is deprecated and will be removed in Dart Sass 2.0.0.
<w>
<w> Recommendation: math.div($gutter-padding, 2) or calc($gutter-padding / 2)
<w>
<w> More info and automated migrator: https://sass-lang.com/d/slash-div
<w>
<w> src\main\webpack\components\title\scss\styles\_label.scss 4:23 @15844621
<w> src\main\webpack\site\main.scss 12:11931 root stylesheet
<w>
2022-09-26 15:29:43: webpack 5.68.0 compiled successfully in 6979 ms