flyntwp / flynt

Component based WordPress starter theme, powered by ACF Pro and Timber, optimized for a11y and fast page load results.
https://flyntwp.com
MIT License
735 stars 84 forks source link

How to link scripts correctly #471

Closed philipphaunstetter closed 1 year ago

philipphaunstetter commented 1 year ago

Hey folks 👋,

just wondering how to get it working … I want to create a script which can be imported in different components. So I created the script animation.js in the /assets/scripts/ folder. When I am editing my component I want to load the script from this folder. I use but on the rendered site I get the error [Error] Failed to load resource: the server responded with a status of 404 (Not Found) (animation.js, line 0) -> http://philipphaunstettercom.local/assets/scripts/animation.js.

Do I need to configure something else to get it working this way? e.g. do I need to import the script in another basic development folder ? Or don't I need to load scripts from this folder because they are rendered automatically in the dist folder (what is not working)?

Greetings :-) and a have a nice weekend!

philipphaunstetter commented 1 year ago

👋

Import ./scripts/scriptname in the /assets/main.js should do the trick, right?

You can close it if this is correct!

timohubois commented 1 year ago

@philipphaunstetter by default all script.js files from the component folders will be imported inside the main.js. If you want to import additional scripts you can import them inside the main.js for sure or inside the script.js from the component folder itself.

philipphaunstetter commented 1 year ago

@timohubois thank you very much. Yeah I know the scripts.js workflow, but want to reduce the number of scripts loaded & added - especially when the same code is used in more than one component. I want to setup my own basic animation scripts and styles to be used in components.

Thank you and I wish you a chill and calm end of the year! :)

P.S.: I hope this is not going to open the case again ;)

timohubois commented 1 year ago

@philipphaunstetter scripts and styles are currently bundled in one file, each. So they should’t loaded twice – if no other customisations has been made.

If you want to reduce the size of the bundled files, splitting the code may be a good choice. For that I currently can not provide a fast solution because this needs some deeper adjustments. However, we are currently working on a new approach to load scripts in modern way – which will be a part the next release and brings also some other advantages.

Hope this helps. Keep chill and calm, too 🚀