Assets #868

.circleci/config.yml

@@ -97,13 +97,12 @@ jobs:
           key: dep-{{ checksum "ver.txt" }}-{{ checksum "requires-ci.txt" }}-{{ checksum "requires-install.txt" }}-{{ checksum "requires-testing.txt" }}
           paths:
               - "venv"
-
       - run:
           name: ️️🏗️ build core
           command: |
               . venv/bin/activate && pip install --upgrade -e . --quiet && mkdir packages
               python setup.py sdist && mv dist/* packages/
-              cd dash-renderer && npm install --ignore-scripts && npm run build:dev && npm run build && python setup.py sdist && mv dist/* ../packages/ && cd ..
+              cd dash-renderer && npm run build && python setup.py sdist && mv dist/* ../packages/ && cd ..
               git clone --depth 1 https://github.com/plotly/dash-core-components.git
               cd dash-core-components && npm install --ignore-scripts && npm run build && python setup.py sdist && mv dist/* ../packages/  && cd ..
               git clone --depth 1 https://github.com/plotly/dash-renderer-test-components

.gitignore

@@ -62,7 +62,6 @@ node_modules/
 .npm
 npm-debug*
 
-dash_renderer/bundle.js
-dash_renderer/bundle.js.map
-dash_renderer.dev*
-dash_renderer.min*
+dash_renderer/
+digest.json
+VERSION.txt

CONTRIBUTING.md

@@ -8,13 +8,37 @@ Glad that you decided to make your contribution in Dash, to set up your developm
 # in your working directory
 $ git clone https://github.com/plotly/dash
 $ cd dash
-# create a virtualenv
-$ python3 -m venv venv
-# activate the virtualenv (on windows venv\scripts\activate)
-$ . venv/bin/activate
-# Install the dev dependencies
-$ pip install -r .circleci/requirements/dev-requirements.txt
+$ python3 -m venv .venv/dev
+# activate the virtualenv (on windows .venv\dev\scripts\activate)
+$ . .venv/dev/bin/activate
+# install dash and dependencies
+$ pip install -e .[testing,ci]  # might need \ to espcae []
+$ cd dash-renderer
+# build renderer bundles, this will build all bundles from source code
+# the only true source of npm version is defined in package.json
+$ npm run build
+# install dash-renderer for development
+$ pip install -e .
+# you should see both dash and dash-renderer are pointed to local source repos
+$ pip list | grep dash
 ```
+
+### Dash-Renderer Beginner Guide
+
+`Dash Renderer`  was a separate Dash project. It was merged into main  `Dash`  repository as part of 1.0 release. The frontend Dash, at its core, is driven by the renderer to handle React Components layout and backend event handling.
+
+If you want to contribute or simply dig deeper into Dash. We encourage you to play and taste it. This is the most efficient way to learn and understand everything under the hood.
+
+For contributors who have purely  **Python**  or  **R**  background. This section might help you understand more details about developing and debugging in Javascript world.
+
+After Dash 1.2, The renderer bundle and its peer dependencies can be packed and generated from the source code. The only version of the truth is defined in  `dash-renderer\package.json`  file. A build tool  `renderer`, which is a tiny Python script defined as a Dash entry point, has few  commands like:
+1.  `renderer npm`  installs all the npm modules using this  `package.json`  files. Note that the  `package-lock.json`  file is the computed reference product for the versions defined with tilde(~) or caret(^) syntax in  **npm**
+2.  `renderer bundles`  parses the locked version JSON, copies all the peer dependencies into dash_renderer folder, bundles the renderer assets, and generates an `__init__.py`  to map all the resources
+3.  `renderer digest {renderer version}`  computes the content hash of each asset in  `dash_renderer`  folder, prints out the result in logs, and dumps into a JSON file  `digest.json`
+4.  `renderer watch` runs the webpack in watch mode, so any source code change triggers a rebuild
+
+When a change in renderer code doesn't reflect in your browser as expected, this could be: confused bundle generation, caching issue in a browser, python package not in `editable` mode, etc. The new tool reduces the risk of bundle assets by adding the digest to help compare asset changes.
+
 ## Git
 
 Use the [GitHub flow][] when proposing contributions to this repository (i.e. create a feature branch and submit a PR against the default branch).

dash-renderer/.eslintrc.json

@@ -1,5 +1,27 @@
 {
     "extends": ["eslint:recommended", "prettier"],
+    "settings": {
+      "react": {
+        "createClass": "createReactClass", // Regex for Component Factory to use,
+                                           // default to "createReactClass"
+        "pragma": "React",  // Pragma to use, default to "React"
+        "version": "detect" // React version. "detect" automatically picks the version you have installed.
+                             // You can also use `16.0`, `16.3`, etc, if you want to override the detected value.
+                             // default to latest and warns if missing
+                             // It will default to "detect" in the future
+      },
+      "propWrapperFunctions": [
+          // The names of any function used to wrap propTypes, e.g. `forbidExtraProps`. If this isn't set, any propTypes wrapped in a function will be skipped.
+          "forbidExtraProps",
+          {"property": "freeze", "object": "Object"},
+          {"property": "myFavoriteWrapper"}
+      ],
+      "linkComponents": [
+        // Components used as alternatives to <a> for linking, eg. <Link to={ url } />
+        "Hyperlink",
+        {"name": "Link", "linkAttribute": "to"}
+      ]
+    },
     "parser": "babel-eslint",
     "parserOptions": {
       "ecmaVersion": 6,

dash-renderer/CHANGELOG.md

@@ -2,6 +2,12 @@
 All notable changes to this project will be documented in this file.
 This project adheres to [Semantic Versioning](http://semver.org/).
 
+## Unreleased
+
+- Clean all the binary assets in dash-renderer repo, add tool to build all the required bundles from fresh source code to avoid confusion of the assets and improve the release process. [#874](https://github.com/plotly/dash/pull/874)
+
+  fixes [#868](https://github.com/plotly/dash/pull/868) and [#734](https://github.com/plotly/dash/pull/734)
+
 ## [1.0.0] - 2019-06-20
 ### Changed
 - Undo/redo toolbar is removed by default, unless `config.show_undo_redo=true` is provided. The CSS hack `._dash-undo-redo:{display:none;}` is no longer needed [#175](https://github.com/plotly/dash-renderer/pull/175)

dash-renderer/MANIFEST.in

@@ -1,7 +1,4 @@
-include dash_renderer/dash_renderer.dev.js
-include dash_renderer/dash_renderer.dev.js.map
-include dash_renderer/dash_renderer.min.js
-include dash_renderer/dash_renderer.min.js.map
-include dash_renderer/react-dom@*.min.js
-include dash_renderer/react@*.min.js
-include dash_renderer/prop-types@*.js
+include package.json
+include digest.json
+include dash_renderer/*.js
+include dash_renderer/*.map