How do I stop a script from being bundled? | Astro Lounge | Page 1

velvet matrix Dec 30, 2022, 5:02 PM

#

I have a script which handles a category selection system.
It works fine in dev, but it stops working when built, so Im guessing this has to do with it being bundled.
How do I stop it from being bundled?

Edit: when bundled, the category selector still works (see image), just the divs don't update accordingly

I'm loading the script like this:

<script src="../scripts/categoryHandler.ts"></script>

The file itself is in src/scripts/

I tried switching to a .js inside the public directory and using

<script src="/scripts/categoryHanderl.js" is:inline></script>

but that made it not work at all

pallid lichen Dec 30, 2022, 5:09 PM

#

If don't want your script to be bundled, you need to put in int the /public directory

#

https://docs.astro.build/en/guides/client-side-scripts/#load-external-scripts

velvet matrix Dec 30, 2022, 5:12 PM

#

yea, sorry I just added that to the initial post (is:inline made it not work at all).

When the script is being bundled, it kind of works, but not really.

The script adds an invisible class to all divs that dont have the id of the selected category. But that stops working when building the project.

Is Astro not capable of such things?

pallid lichen Dec 30, 2022, 5:15 PM

#

We can definitely do that in Astro.
Can you post the relevant parts of your code?

velvet matrix Dec 30, 2022, 5:21 PM

#

yea sorry ofcourse.

This is the whole file: https://gist.github.com/maurxce/cc782f6f4a4bad1a8e2cb7c92b0b5c97

and this is the most relevant section from that file: https://gist.github.com/maurxce/d86ab9439dda7e0f1c3028508bf90eba

pallid lichen Dec 30, 2022, 5:43 PM

#

Taking a look...

#

Surprised that this even works at all in dev, you're using the setClickListener variable before initialization, can you try adding the events after the variable declaration?

velvet matrix Dec 30, 2022, 5:56 PM

#

I think I recall being taught that using functions before their initialized is not a problem. Might be mistaken though

Anyways, moving the addEventListener so its being called after setClickListener is initialized sadly does nothing

pallid lichen Dec 30, 2022, 6:07 PM

#

Do you get any hints on the console?

velvet matrix Dec 30, 2022, 6:07 PM

#

theres no error

#

I think I know whats going on

pallid lichen Dec 30, 2022, 6:12 PM

#

Yeah?

velvet matrix Dec 30, 2022, 6:13 PM

#

okay so yea it's fixed

#

basically

#

the code is fine

#

Im using vite-plugin-purgecss and it removed the invisible class on build, because by default (all categories shown) its not being used so yea

the fix was:

import htmlPurge from "vite-plugin-purgecss";

export default defineConfig({
  vite: {
    plugins: [
      htmlPurge({ safelist: ["is-invisible"] })
    ]
  }
});

#

I appreciate the help

#How do I stop a script from being bundled?