Ui formatting for account details |
||
---|---|---|
app | ||
development | ||
docs | ||
test | ||
ui | ||
.babelrc | ||
.editorconfig | ||
.eslintrc | ||
.gitattributes | ||
.gitignore | ||
.jshintrc | ||
.nvmrc | ||
.travis.yml | ||
.yo-rc.json | ||
CHANGELOG.md | ||
CONTRIBUTING.md | ||
README.md | ||
USER_AGREEMENT.md | ||
circle.yml | ||
fonts | ||
gulpfile.js | ||
images | ||
package.json | ||
ui-dev.js |
README.md
Metamask Plugin ![Build Status](https://circleci.com/gh/MetaMask/metamask-plugin.svg?style=shield&circle-token=a1ddcf3cd38e29267f254c9c59d556d513e3a1fd)
Architecture
Development
npm install
Developing on UI Only
You can run npm run ui
, and your browser should open a live-reloading demo version of the plugin UI.
Some actions will crash the app, so this is only for tuning aesthetics, but it allows live-reloading styles, which is a much faster feedback loop than reloading the full extension.
Developing with Gulp
We're using an experimental version of gulp-cli
, so if you have the old version of gulp, you'll need to uninstall it, npm uninstall -g gulp
, and install this one instead:
npm install gulpjs/gulp-cli#4.0 -g
After that, you can just:
gulp dev
In Chrome
Open Settings
> Extensions
.
Check "Developer mode".
At the top, click Load Unpacked Extension
.
Navigate to your metamask-plugin/dist
folder.
Click Select
.
You now have the plugin, and can click 'inspect views: background plugin' to view its dev console.
Developing the UI
To enjoy the live-reloading that gulp dev
offers while working on the web3-provider-engine
or other dependencies:
- Clone the dependency locally.
npm install
in its folder.- Run
npm link
in its folder. - Run
npm link $DEP_NAME
in this project folder. - Next time you
gulp dev
it will watch the dependency for changes as well!
Running Tests
Requires mocha
installed. Run npm install -g mocha
.
Then just run npm test
.
You can also test with a continuously watching process, via npm run watch
.
You can run the linter by itself with gulp lint
.
Deploying the UI
You must be authorized already on the Metamask plugin.
- Update the version in
app/manifest.json
and the Changelog inCHANGELOG.md
. - Visit the chrome developer dashboard.
- Zip the
dist
folder in this repository. - Upload that zip file as the updated package.