Immerx DevTools

Immerx debugging tools in Chrome developer console.

什麼是Immerx DevTools？

Immerx DevTools是由Ionut Achim開發的Chrome擴展程式，該擴展的主要功能是“Immerx debugging tools in Chrome developer console.”。

擴展截圖

screenshot
screenshot
screenshot

下載Immerx DevTools擴展crx文件

下載Immerx DevTools擴展crx格式的文件，手動將Chrome擴充功能安裝到瀏覽器中，也可以將crx文件分享給朋友，輕鬆安裝Chrome擴充功能。

擴展使用說明

                        ImmerX DevTools is a Chrome DevTools extension for the open-source JS state management library - ImmerX.

It helps developers visualise ImmerX state changes in the Chrome Developer Tools. It creates a new panel called "Immerx DevTools" that contains 4 main components:

1. "Update List" - A filterable, vertical scrolling list of all the state updates.
2. "Patches" - Where you can see all the immer patches that were applied during the selected state update. Each patch containing information about he operation type, the path and the diff.
3. "State" - Display the state value resulted from the selected update, or the current value if no update is selected.
4. "Diff" - Shows a diff between the state values before and after the selected update.

See an interactive demo of the inlined version here:
https://monojack.github.io/immerx-todomvc

You can learn more about ImmerX here:
https://github.com/monojack/immerx

Code for this extension is open-sourced at:
https://github.com/monojack/immerx-devtools

擴展基本資訊

名稱 Immerx DevTools Immerx DevTools
ID jchcefekimgnfceonnnekpgmphepengp
官方網址 https://chromewebstore.google.com/detail/immerx-devtools/jchcefekimgnfceonnnekpgmphepengp
簡介 Immerx debugging tools in Chrome developer console.
檔案大小 81.98 KB
安裝次數 24
目前版本 0.2.0
更新時間 2020-06-08
上架時間 2020-06-08
開發者 Ionut Achim
電子郵箱 [email protected]
付費類型 free
擴展官網 https://github.com/monojack/immerx-devtools
說明頁面URL https://github.com/monojack/immerx-devtools/issues
支援的語言 en-GB
manifest.json 
{
    "update_url": "https:\/\/clients2.google.com\/service\/update2\/crx",
    "version": "0.2.0",
    "author": "Ionut Achim ",
    "name": "Immerx DevTools",
    "short_name": "Immerx DevTools",
    "description": "Immerx debugging tools in Chrome developer console.",
    "icons": {
        "16": "icons\/icon-64.png",
        "48": "icons\/icon-128.png",
        "128": "icons\/icon-400.png"
    },
    "page_action": [],
    "content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'",
    "permissions": [
        "tabs",
        "http:\/\/*\/*",
        "https:\/\/*\/*"
    ],
    "devtools_page": "devtools.html",
    "background": {
        "scripts": [
            "background.js"
        ],
        "persistent": false
    },
    "web_accessible_resources": [
        "panel.html"
    ],
    "content_scripts": [
        {
            "matches": [
                ""
            ],
            "js": [
                "hook.js",
                "contentScript.js"
            ],
            "run_at": "document_start"
        }
    ],
    "manifest_version": 2
}

相關的擴展

Solid Devtools
Solid Devtools
React Developer Tools
React Developer Tools
Preact Developer Tools
Preact Developer Tools
Livewire devtools
Livewire devtools
Web Developer Tool for Chrome
Web Developer Tool for Chrome