Adding local .js files to my app

Panel
21

Good to hear you got it working. I added a warning to the readme that the command line serve may give issues, as we have both experienced.

22

I have a follow-up question on this topic. I would like to make an offline portable version of the golden-layout based panel. The problem with the default approach is that the static assets aren’t included:

from bokeh.resources import INLINE
my_panel.save('index.html', resources=INLINE)

Is there a way to include static assets in combination with .save() ?

p.s. It is nice if these assets are inlined in the html, but this isn’t that important as it is also
fine to share a directory in stead of just an html file, or use an inline tool afterwards.

23

@Leonidas At the moment there is not, it’s worth filing an issue about that though.

24

Thanks for the response. Here is the issue.

26

I’m sorry but I would like to report that I also have a trouble import js_files locally.

I’m working for using the sortable list (please see here Sortable Widget - #16 by Marc)

This does work

pn.extension(js_files={'sortablelist': "https://raw.githack.com/SortableJS/Sortable/master/Sortable.js"})

This does not work

pn.extension(js_files={'sortablelist': "Sortable.js"})

The Sortable.js is in the same folder as my python script notebook file.

27

I am using Panel 1.4.0 and this issue persists.

  GNU nano 4.8                                            test.py                                             Modified  import panel as pn

# Load the JavaScript file
pn.extension(js_files={'/recording.js': 'static/recording.js'})

# Define a simple application
def app():
    return pn.pane.Markdown("Hello, Panel!")

# Serve the application
pn.serve(app)

In the static folder I have this in recording.js:

console.log("Test JavaScript file loaded");

I get 404 errors like so:

GET
http://localhost:41743/static/recording.js
[HTTP/1.1 404 Not Found 2ms]

Is this a problem with the new V1.4.0?

What would be very nice is have an equivalent for js content like you have with css - pn.config.raw_css.append(css_content)

28

I also tried this:

Add the CSS content to the Panel configuration

pn.config.raw_css.append(css_content)

pn.config.js_files[‘custom_bundle’] = [RECORD_AUDIO_JS]

pn.extension()

Where RECORD_AUDIO_JS is the content of my recording.js file as a string.

I get this:

File “/dev/3_11venv/lib/python3.11/site-packages/panel/io/resources.py”, line 714, in js_files
js_files = self.adjust_paths([
^^^^^^^^^^^^^^^^^^^
File “/dev/3_11venv/lib/python3.11/site-packages/panel/io/resources.py”, line 603, in adjust_paths
resource = resource.replace(‘https://unpkg.com’, config.npm_cdn)
^^^^^^^^^^^^^^^^
AttributeError: ‘list’ object has no attribute ‘replace’
500 GET / (127.0.0.1) 477.57ms