✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
🐇 Announcing Dash VTK for 3d simulation graphics. Check out the March webinar.

How to correctly include a custom component in a plotly dash project

I am trying to get a custom component included in my plotly dash project. I followed the cookiecutter example, and successfully ran npm run build to build the component. Assuming that the component was in some folder my_component, I copied the build folder my_component/my_component into apps/components/my_component. I then ran my server with python3 apps/server.py. This is the error I received when trying to include with a from components.my_component import MyComponent:

Traceback (most recent call last):
  File "apps/server.py", line 27, in <module>
    app.run_server(debug=True, host="", port=8000, ssl_context="adhoc")
  File "/home/x/.local/lib/python3.6/site-packages/dash/dash.py", line 1540, in run_server
  File "/home/x/.local/lib/python3.6/site-packages/dash/dash.py", line 1347, in enable_dev_tools
    for x in list(ComponentRegistry.registry) + ["dash_renderer"]
  File "/home/x/.local/lib/python3.6/site-packages/dash/dash.py", line 1345, in <listcomp>
    for package in (
AttributeError: 'NoneType' object has no attribute 'filename'

Am I missing something in the custom component development process?

1 Like