diff --git a/cookiecutter.json b/cookiecutter.json index 01ce0f1..4cd4d3c 100644 --- a/cookiecutter.json +++ b/cookiecutter.json @@ -2,8 +2,6 @@ "project_name": "my dash component", "project_shortname": "{{ cookiecutter.project_name.lower()|replace(' ', '_')|replace('-', '_') }}", "component_name": "{{ cookiecutter.project_shortname.split('_')|map('capitalize')|join('') }}", - "jl_prefix": "", - "r_prefix": "", "author_name": "Enter your first and last name (For package.json)", "author_email": "Enter your email (For package.json)", "github_org": "", diff --git a/{{cookiecutter.project_shortname}}/README.md b/{{cookiecutter.project_shortname}}/README.md index 56382a9..588fc98 100644 --- a/{{cookiecutter.project_shortname}}/README.md +++ b/{{cookiecutter.project_shortname}}/README.md @@ -37,16 +37,53 @@ pip install {{cookiecutter.project_shortname}} npm run build ``` -### Component Code -### Publish +### Create a production build and publish: -If publish on npm: -```shell -npm build -npm publish +1. Clean up build and dist - removes old and temp tarballs: +``` +rm -rf dist build +``` + + +2. Run a new build +``` +npm install +npm run build +``` + +3. Build source distribution. +``` +npm run dist +``` + +4. Test your tarball by copying it into a new environment and installing it locally, for example: +``` +pip install .tar.gz ``` +Note: For local install, use: + +``` +pip install -e ./path-to-project +``` + + +5. Publish on PyPI + +Prepare release on the GitHub UI - For more information see [Managing Releases](https://docs.github.com/en/repositories/releasing-projects-on-github/managing-releases-in-a-repository) +When in doubt, do an alpha release first +``` +$ twine upload dist/* +``` +6. If publish on npm: + +Note: Publishing your component to NPM will make the JavaScript bundles available on the unpkg CDN. By default, Dash serves the component library's CSS and JS locally, but if you choose to publish the package to NPM you can set `serve_locally` to `False` and you may see faster load times. +``` +npm publish +``` + + ### Justfile Alternatively, use the provided [just](https://github.com/casey/just) commands: diff --git a/{{cookiecutter.project_shortname}}/package.json b/{{cookiecutter.project_shortname}}/package.json index b925da0..4b3ccf5 100644 --- a/{{cookiecutter.project_shortname}}/package.json +++ b/{{cookiecutter.project_shortname}}/package.json @@ -1,6 +1,6 @@ { "name": "{{cookiecutter.project_shortname}}", - "version": "1.0.0", + "version": "0.0.1", "description": "{{cookiecutter.description}}", "main": "index.ts", {% if cookiecutter.github_org -%} @@ -16,27 +16,30 @@ "scripts": { "build:js::dev": "webpack --mode development", "build:js": "webpack", - "build:backends": "dash-generate-components ./src/ts/components {{ cookiecutter.project_shortname }} -p package-info.json --r-prefix '{{ cookiecutter.r_prefix }}' --jl-prefix '{{ cookiecutter.jl_prefix }}' --ignore \\.test\\.", + "build:backends": "dash-generate-components ./src/ts/components {{ cookiecutter.project_shortname }} -p package-info.json --ignore \\.test\\.", "build": "npm run build:js && npm run build:backends", - "watch": "npm run build:js::dev -- --watch" + "watch": "npm run build:js::dev -- --watch", + "dist": "python -m build --sdist --wheel --outdir dist/", + "format": "prettier --write src --ignore-path=.prettierignore" }, "devDependencies": { - "@types/react": "^17.0.39", - "css-loader": "^6.7.1", + "@types/react": "^18.2.0", + "@types/react-dom": "^18.2.0", + "css-loader": "^6.10.0", "npm-run-all": "^4.1.5", - "ramda": "^0.28.0", - "react": "16.13.0", - "react-docgen": "^5.4.0", - "react-dom": "16.13.0", - "style-loader": "^3.3.1", + "react": "18.2.0", + "react-docgen": "^5.4.3", + "react-dom": "18.2.0", + "style-loader": "^3.3.4", "ts-loader": "^9.3.1", - "typescript": "^4.7.4", - "webpack": "^5.73.0", - "webpack-cli": "^4.10.0" + "typescript": "^5.6.3", + "webpack": "^5.101.0", + "webpack-cli": "^5.1.4", + "prettier": "^3.2.4" }, "peerDependencies": { - "react": "^16.13.0", - "react-dom": "^16.13.0" + "react": "16 - 19", + "react-dom": "16- 19" }, "author": "{{ cookiecutter.author_name }} <{{ cookiecutter.author_email }}>", "license": "{% set _license_identifiers = {'MIT License': 'MIT','BSD License': 'BSD','ISC License': 'ISC','Apache Software License 2.0': 'Apache-2.0','GNU General Public License v3': 'GPL-3.0','Not open source': ''} %}{{ _license_identifiers[cookiecutter.license] }}" diff --git a/{{cookiecutter.project_shortname}}/requirements.txt b/{{cookiecutter.project_shortname}}/requirements.txt index 03c4abe..5c89633 100644 --- a/{{cookiecutter.project_shortname}}/requirements.txt +++ b/{{cookiecutter.project_shortname}}/requirements.txt @@ -1,3 +1,3 @@ -dash[dev]>=2.5.1 +dash[dev]>=3.0.0 wheel build diff --git a/{{cookiecutter.project_shortname}}/src/ts/components/{{cookiecutter.component_name}}.tsx b/{{cookiecutter.project_shortname}}/src/ts/components/{{cookiecutter.component_name}}.tsx index 4a0492b..810a78d 100644 --- a/{{cookiecutter.project_shortname}}/src/ts/components/{{cookiecutter.component_name}}.tsx +++ b/{{cookiecutter.project_shortname}}/src/ts/components/{{cookiecutter.component_name}}.tsx @@ -17,6 +17,4 @@ const {{cookiecutter.component_name}} = (props: Props) => { ) } -{{cookiecutter.component_name}}.defaultProps = {}; - export default {{cookiecutter.component_name}}; diff --git a/{{cookiecutter.project_shortname}}/usage.py b/{{cookiecutter.project_shortname}}/usage.py index 532cbfd..9fba8a1 100644 --- a/{{cookiecutter.project_shortname}}/usage.py +++ b/{{cookiecutter.project_shortname}}/usage.py @@ -1,10 +1,10 @@ import {{cookiecutter.project_shortname}} import dash -app = dash.Dash(__name__) +app = dash.Dash() app.layout = {{cookiecutter.project_shortname}}.{{cookiecutter.component_name}}(id='component') if __name__ == '__main__': - app.run_server(debug=True) + app.run(debug=True)