Vanilla HTML components for Dash
As of Dash 2, the development of dash-html-components has been moved to the main Dash repo
This package exists for backward compatibility
Vanilla HTML components for Dash
Create a virtual env and activate.
$ virtualenv venv
$ venv/bin/activate
Note: venv\Scripts\activate for Windows
Install Python packages required to build components.
$ pip install -r dev-requirements.txt
Generate components and install npm packages
$ npm install
The components in src/components
, as well as the export index in
src/index.js
are programmatically generated from element definitions in
scripts/
. To regenerate:
$ npm run generate-components
The list of attributes is regenerated by scraping the MDN HTML attribute reference.
Note: This step will have already been done for you when you ran npm install
Watch for changes
$ npm run build:watch
Install module locally (after every change)
# Generate metadata, and build the JavaScript bundle
$ npm run install-local
# Now you're done. For subsequent changes, if you've got `npm run build:watch`
$ python setup.py install
Run the Dash layout you want to test
# Import dash_html_components to your layout, then run it:
$ python my_dash_layout.py
Before publishing to PyPi, you can test installing the module locally:
# Install in `site-packages` on your machine
$ npm run install-local
$ npm run uninstall-local
See the contributing guide for guidelines on contributing to this project.
Build your code:
$ npm run build
Create a Python tarball
$ python setup.py sdist
This distribution tarball will get generated in the dist/
folder
Test your tarball by copying it into a new environment and installing it locally:
$ pip install dash-html-components-<new-version>.tar.gz
If it works, then you can publish the component to NPM and PyPI:
$ twine upload dist/*
$ rm -rf dist
publish_on_npm
)$ npm publish
Publishing your component to NPM will make the JavaScript bundles available on the unpkg CDN. By default, Dash servers the component library's CSS and JS from the remote unpkg CDN, so if you haven't published the component package to NPM you'll need to set the serve_locally
flags to True
(unless you choose False
on publish_on_npm
). We will eventually make serve_locally=True
the default, follow our progress in this issue.