Skip to content

Commit a44edd1

Browse files
author
Timothy Johnson
authored
Update README.md
1 parent 6b40c9b commit a44edd1

File tree

1 file changed

+15
-28
lines changed

1 file changed

+15
-28
lines changed

README.md

Lines changed: 15 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
11
# Svelte DevTools
22

3+
Install from the [Firefox addon page](https://addons.mozilla.org/en-US/firefox/addon/svelte-devtools/) or the
4+
[Chrome addon page](https://chrome.google.com/webstore/detail/svelte-devtools/ckolcbmkjpjmangdbmnkpjigpkddpogn)
5+
36
Svelte Devtools is a Firefox and Chrome extension for the Svelte javascript framework. It allows you to inspect the Svelte state and component hierarchies in the Developer Tools.
47

58
After installing you will see a new tab in Developer Tools. This tab displays a tree of Svelte components, HTMLx blocks, and DOM elements that were rendered on the page. By selecting one of the nodes in the tree, you can inspect and edit its current state in the panel to the right.
@@ -8,45 +11,29 @@ After installing you will see a new tab in Developer Tools. This tab displays a
811

912
![0.1.1 Screenshot](https://raw.githubusercontent.com/RedHatter/svelte-devtools/master/screenshot.png "0.2.0 Screenshot")
1013

11-
## Installation
12-
13-
### Firefox
14-
15-
Install from the [firefox addon page](https://addons.mozilla.org/en-US/firefox/addon/svelte-devtools/).
14+
# Build from source
1615

17-
#### From source
16+
## Building
1817

19-
Unsigned addons can't be install in firefox permanently but addons can be installed temporarily from the `about:debugging` page.
20-
21-
1. Clone this repository and run the package script.
18+
Clone this repository and run the package script.
2219
```
2320
git clone https://github.com/RedHatter/svelte-devtools.git
2421
cd svelte-devtools
2522
npm install
2623
npm run package
2724
```
28-
This should generate a zip file under `web-ext-artifacts`.
29-
30-
2. Open `about:debugging` in firefox. Click "Load Temporary Add-on" and choose the generated zip file.
25+
This should build the codebase and output a zip file under `web-ext-artifacts`.
3126

32-
### Chrome
27+
## Installing
3328

34-
Svelte DevTools is still under review for chrome. However pre-packaged archives can be downloaded from the releases page.
29+
### Firefox
3530

36-
1. Download the `zip` archive from the release page and unpack it.
37-
2. Open chrome and navigate to `chrome://extensions/`.
38-
3. Turn on developer mode using the 'Developer mode' switch in the upper right hand corner of the page.
39-
3. Click 'Load Unpacked' and select the directory contain the extension files.
31+
Unsigned addons can't be install in firefox permanently but addons can be installed temporarily.
32+
1. Navigate to `about:debugging`.
33+
2. Click "Load Temporary Add-on" and choose the generated zip file.
4034

41-
#### From source
35+
### Chrome
4236

43-
1. Clone this repository and run the build script.
44-
```
45-
git clone https://github.com/RedHatter/svelte-devtools.git
46-
cd svelte-devtools
47-
npm install
48-
npm run build
49-
```
50-
2. Open chrome and navigate to `chrome://extensions/`.
51-
3. Turn on developer mode using the 'Developer mode' switch in the upper right hand corner of the page.
37+
1. Navigate to `chrome://extensions/`.
38+
2. Turn on developer mode using the 'Developer mode' switch in the upper right hand corner of the page.
5239
3. Click 'Load Unpacked' and select the `dest` directory.

0 commit comments

Comments
 (0)