party-js | JavaScript library to brighten up your user 's site | Frontend Framework library

Your script snippet does not "depend" on your component in your example snippet. You are requesting any input with type "range" in the whole web page (document's root) and that is not necessarily your component. (If you have 10 input[type="range"] in your page, the script will have to handle that somehow, or it will only get the first one).

The way to do what you are trying to do IS to put it in the assets folder. If that is forbidden by any project rule, you have two options:

1. Upload your sidebar.js file into a different server or a different path and host it from there. Since it seems you don't have control over the files in your customer server, you can't make the assumption that the /src/app/ directory is present (since it is not necessary to run the app after it has been built)

2. Transform your .js file into a typescript file (.ts) and import it so that typescript can compile it.

To transform it into a .js file, just rename the file to sidebar.ts and, at the file you want to include it, import for side effects only

What I recommend is that you wrap your file in a callable function that receives your component reference as a parameter so that you can specify which element is to related to as opposed to let it find in the document root but I suspect that would involve messing with the internals of the sidebar.js file. However if the sidebar file is a library or a module, this might be too time-consuming.