mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-11-26 20:39:08 +01:00
76 lines
4.3 KiB
Markdown
76 lines
4.3 KiB
Markdown
# MetaMask Plugin [![Build Status](https://circleci.com/gh/MetaMask/metamask-plugin.svg?style=shield&circle-token=a1ddcf3cd38e29267f254c9c59d556d513e3a1fd)](https://circleci.com/gh/MetaMask/metamask-plugin)
|
|
|
|
## Architecture
|
|
|
|
[![Architecture Diagram](./docs/architecture.png)][1]
|
|
|
|
## Development
|
|
|
|
```bash
|
|
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:
|
|
|
|
```bash
|
|
npm install gulpjs/gulp-cli#4.0 -g
|
|
```
|
|
|
|
After that, you can just:
|
|
```bash
|
|
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:
|
|
|
|
1. Clone the dependency locally.
|
|
2. `npm install` in its folder.
|
|
3. Run `npm link` in its folder.
|
|
4. Run `npm link $DEP_NAME` in this project folder.
|
|
5. 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.
|
|
|
|
0. Update the version in `app/manifest.json` and the Changelog in `CHANGELOG.md`.
|
|
1. Visit [the chrome developer dashboard](https://chrome.google.com/webstore/developer/dashboard?authuser=2).
|
|
2. Zip the `dist` folder in this repository.
|
|
3. Upload that zip file as the updated package.
|
|
|
|
[1]: http://www.nomnoml.com/#view/%5B%3Cactor%3Euser%5D%0A%0A%5Bmetamask-ui%7C%0A%20%20%20%5Btools%7C%0A%20%20%20%20%20react%0A%20%20%20%20%20redux%0A%20%20%20%20%20thunk%0A%20%20%20%20%20ethUtils%0A%20%20%20%20%20jazzicon%0A%20%20%20%5D%0A%20%20%20%5Bcomponents%7C%0A%20%20%20%20%20app%0A%20%20%20%20%20account-detail%0A%20%20%20%20%20accounts%0A%20%20%20%20%20locked-screen%0A%20%20%20%20%20restore-vault%0A%20%20%20%20%20identicon%0A%20%20%20%20%20config%0A%20%20%20%20%20info%0A%20%20%20%5D%0A%20%20%20%5Breducers%7C%0A%20%20%20%20%20app%0A%20%20%20%20%20metamask%0A%20%20%20%20%20identities%0A%20%20%20%5D%0A%20%20%20%5Bactions%7C%0A%20%20%20%20%20%5BaccountManager%5D%0A%20%20%20%5D%0A%20%20%20%5Bcomponents%5D%3A-%3E%5Bactions%5D%0A%20%20%20%5Bactions%5D%3A-%3E%5Breducers%5D%0A%20%20%20%5Breducers%5D%3A-%3E%5Bcomponents%5D%0A%5D%0A%0A%5Bweb%20dapp%7C%0A%20%20%5Bui%20code%5D%0A%20%20%5Bweb3%5D%0A%20%20%5Bmetamask-inpage%5D%0A%20%20%0A%20%20%5B%3Cactor%3Eui%20developer%5D%0A%20%20%5Bui%20developer%5D-%3E%5Bui%20code%5D%0A%20%20%5Bui%20code%5D%3C-%3E%5Bweb3%5D%0A%20%20%5Bweb3%5D%3C-%3E%5Bmetamask-inpage%5D%0A%5D%0A%0A%5Bmetamask-background%7C%0A%20%20%5Bprovider-engine%5D%0A%20%20%5Bhooked%20wallet%20subprovider%5D%0A%20%20%5Bid%20store%5D%0A%20%20%0A%20%20%5Bprovider-engine%5D%3C-%3E%5Bhooked%20wallet%20subprovider%5D%0A%20%20%5Bhooked%20wallet%20subprovider%5D%3C-%3E%5Bid%20store%5D%0A%20%20%5Bconfig%20manager%7C%0A%20%20%20%20%5Brpc%20configuration%5D%0A%20%20%20%20%5Bencrypted%20keys%5D%0A%20%20%20%20%5Bwallet%20nicknames%5D%0A%20%20%5D%0A%20%20%0A%20%20%5Bprovider-engine%5D%3C-%5Bconfig%20manager%5D%0A%20%20%5Bid%20store%5D%3C-%3E%5Bconfig%20manager%5D%0A%5D%0A%0A%5Buser%5D%3C-%3E%5Bmetamask-ui%5D%0A%0A%5Buser%5D%3C%3A--%3A%3E%5Bweb%20dapp%5D%0A%0A%5Bmetamask-contentscript%7C%0A%20%20%5Bplugin%20restart%20detector%5D%0A%20%20%5Brpc%20passthrough%5D%0A%5D%0A%0A%5Brpc%20%7C%0A%20%20%5Bethereum%20blockchain%20%7C%0A%20%20%20%20%5Bcontracts%5D%0A%20%20%20%20%5Baccounts%5D%0A%20%20%5D%0A%5D%0A%0A%5Bweb%20dapp%5D%3C%3A--%3A%3E%5Bmetamask-contentscript%5D%0A%5Bmetamask-contentscript%5D%3C-%3E%5Bmetamask-background%5D%0A%5Bmetamask-background%5D%3C-%3E%5Bmetamask-ui%5D%0A%5Bmetamask-background%5D%3C-%3E%5Brpc%5D%0A
|