Calling Developers!
We are reenergizing our code contribution process! Learn More

What are the Slack Archives?

It’s a history of our time together in the Slack Community! There’s a ton of knowledge in here, so feel free to search through the archives for a possible answer to your question.

Because this space is not active, you won’t be able to create a new post or comment here. If you have a question or want to start a discussion about something, head over to our categories and pick one to post in! You can always refer back to a post from Slack Archives if needed; just copy the link to use it as a reference..

Hello Team, following on from last post... I was reading this article

Options
U04918F1AHW
U04918F1AHW Posts: 6 🧑🏻‍🚀 - Cadet
edited December 2022 in Help

Hello Team,
following on from last post... I was reading this article
https://docs.spryker.com/docs/scos/dev/front-end-development/zed/overriding-webpack-js-scss-for-zed-on-project-level.html

First part is pretty straight forward.
This part (see attached picture) is somehow unclear (to me) and I find a bit hard to understand:

The newly created entry points for JS files should have suffix .entry, for example, my-module.entry.js). Webpack collects all entry points with this suffix.
Use the following path to add all new entry points for your project: ./src/Pyz/Zed/{%ModuleName%}/assets/Zed/js/*.entry.js.
To extend JS modules from the core level, use aliases. To add a JS module, follow the example:

require('{%AliasName%}/path/to/file.js');
// OR
var ModuleName = require('{%AliasName%}/path/to/file.js');

Where should I add this line? Tnx.

Comments

  • sebastian.larisch
    sebastian.larisch Spryker Customer Posts: 143 🧑🏻‍🚀 - Cadet
    Options

    not my domain but try the following:

    next to your *.entry.js you create a modules directory where you add your js files(s) like custom.js (add some console.log() for testing) and your entry.js should then look like this:

    'use strict';
    
    require('./modules/custom');
    

    when you’re done run vendor/bin/console console frontend:zed:build as it is for ZED

  • U04918F1AHW
    U04918F1AHW Posts: 6 🧑🏻‍🚀 - Cadet
    Options

    I've done it. And I can see newly created module test.js file in public/Zed/assets/js but I dont see its affects on store front. Any further assistance would be much appreciated. Tnx.

  • sebastian.larisch
    sebastian.larisch Spryker Customer Posts: 143 🧑🏻‍🚀 - Cadet
    Options

    Where did u create the files (which module) and where do u expect to see something? Which Zed URL?

  • U04918F1AHW
    U04918F1AHW Posts: 6 🧑🏻‍🚀 - Cadet
    Options

    Good question. I just realized that I need to implement it in proper module and twig file. :crossed_fingers:

  • U04918F1AHW
    U04918F1AHW Posts: 6 🧑🏻‍🚀 - Cadet
    Options

    I did it. Thank you!

  • sebastian.larisch
    sebastian.larisch Spryker Customer Posts: 143 🧑🏻‍🚀 - Cadet
    Options

    u r welcome!