This setup assumes Chromium is in a cr
directory (~/cr/src/...
). To make setup easier, you can modify and export the following variables:
export DEP_ANALYSIS_DIR=~/cr/src/tools/android/dependency_analysis export DEP_ANALYSIS_BUILD_DIR=~/cr/src/out/Debug
See ../README.md
for instructions on using generate_json_dependency_graph.py
, then generate a graph file in the src
directory (js/src/json_graph.txt
) with that exact name:
cd $DEP_ANALYSIS_DIR ./generate_json_dependency_graph.py --C $DEP_ANALYSIS_BUILD_DIR --o js/src/json_graph.txt
The following instructions assume you are in the dependency_analysis/js
= $DEP_ANALYSIS_DIR/js
directory.
First, ensure you have a new Node.js version. The dependency viewer doesn't work with v8, for example.
node -v
Install the latest version with:
nvm install node
You will also need to install npm
if it is not already installed (check with npm -v
), either from the site or via nvm (Node Version Manager).
To install dependencies:
npm install
npm run serve
This command runs webpack-dev-server
in development mode, which will bundle all the dependencies and open localhost:8888/package_view.html
, the entry point of the bundled output. Changes made to the core JS will reload the page, and changes made to individual modules will trigger a hot module replacement.
To view the visualization (if it wasn't automatically opened), open localhost:8888/package_view.html
.
npm run build
This command runs webpack
, which will bundle the all the dependencies into output files in the dist/
directory. These files can then be served via other means, for example:
npm run serve-dist
This command will open a simple HTTP server serving the contents of the dist/
directory.
To build and serve, you can execute the two commands together:
npm run build && npm run serve-dist
To view the visualization, open localhost:8888/package_view.html
.
To run ESLint on the JS and Vue files:
npm run lint
To let ESLint try and fix as many lint errors as it can:
npm run lint-fix