diff --git a/libs/extension/package.json b/libs/extension/package.json index 45f5cb8a..6562c624 100644 --- a/libs/extension/package.json +++ b/libs/extension/package.json @@ -7,7 +7,7 @@ "build": "webpack --config ./webpack.config.js", "watch": "webpack --config ./webpack.config.js --watch", "build-dev": "webpack --config ./webpack.dev.js", - "start": "webpack serve --config ./webpack.dev.js ", + "start": "npm run build && webpack serve --config ./webpack.dev.js ", "test": "jest" }, "keywords": [], diff --git a/libs/extension/src/background/index.ts b/libs/extension/src/background/index.ts index 6a8c4591..01e455f8 100644 --- a/libs/extension/src/background/index.ts +++ b/libs/extension/src/background/index.ts @@ -51,6 +51,7 @@ chrome.runtime.onMessage.addListener(function (message, sender, sendResponse) { changeSource(message, DevToolBackground); connections[tabId].postMessage(message); } else { + // TODO: 如果查询失败,发送 chrome message,请求 panel 主动建立连接 console.log('Tab not found in connection list.'); } } else { diff --git a/libs/extension/src/injector/index.ts b/libs/extension/src/injector/index.ts index 940f0ab9..73692427 100644 --- a/libs/extension/src/injector/index.ts +++ b/libs/extension/src/injector/index.ts @@ -134,6 +134,7 @@ let helper; function init(horizonHelper) { helper = horizonHelper; + window.__HORIZON_DEV_HOOK__.isInit = true; } function injectHook() { @@ -144,6 +145,7 @@ function injectHook() { enumerable: false, value: { init, + isInit: false, addIfNotInclude, send, deleteVNode, diff --git a/libs/extension/src/panel/panel.html b/libs/extension/src/panel/panel.html index ae944454..705a2536 100644 --- a/libs/extension/src/panel/panel.html +++ b/libs/extension/src/panel/panel.html @@ -1,10 +1,8 @@ - + - Horizon - + - -
+
+ diff --git a/libs/extension/webpack.config.js b/libs/extension/webpack.config.js index 25dab94b..86450201 100644 --- a/libs/extension/webpack.config.js +++ b/libs/extension/webpack.config.js @@ -1,5 +1,21 @@ const path = require('path'); const webpack = require('webpack'); +const fs = require('fs'); + +function handleBuildDir() { + const staticDir = path.join(__dirname, 'build'); + console.log('staticDir: ', staticDir); + const isBuildExist = fs.existsSync(staticDir); + console.log('isBuildExist: ', isBuildExist); + if (!isBuildExist) { + fs.mkdirSync(staticDir); + } + fs.copyFileSync(path.join(__dirname, 'src', 'panel', 'panel.html'),path.join(staticDir, 'panel.html')); + fs.copyFileSync(path.join(__dirname, 'src', 'main', 'main.html'),path.join(staticDir, 'main.html')); + fs.copyFileSync(path.join(__dirname, 'src', 'manifest.json'),path.join(staticDir, 'manifest.json')); +} +handleBuildDir(); + const config = { entry: { diff --git a/libs/extension/webpack.dev.js b/libs/extension/webpack.dev.js index b3332077..fc29852f 100644 --- a/libs/extension/webpack.dev.js +++ b/libs/extension/webpack.dev.js @@ -47,7 +47,7 @@ module.exports = { }, devServer: { static: { - directory: path.join(__dirname, 'dist'), + directory: path.join(__dirname, 'build'), }, open: 'panel.html', port: 9000, diff --git a/libs/horizon/src/external/devtools.ts b/libs/horizon/src/external/devtools.ts index 38167db5..10e70e80 100644 --- a/libs/horizon/src/external/devtools.ts +++ b/libs/horizon/src/external/devtools.ts @@ -74,7 +74,7 @@ export const helper = { }, }; -function injectUpdater() { +export function injectUpdater() { const hook = window.__HORIZON_DEV_HOOK__; if (hook) { hook.init(helper); diff --git a/libs/horizon/src/renderer/TreeBuilder.ts b/libs/horizon/src/renderer/TreeBuilder.ts index 8fff0435..923b4275 100644 --- a/libs/horizon/src/renderer/TreeBuilder.ts +++ b/libs/horizon/src/renderer/TreeBuilder.ts @@ -36,6 +36,7 @@ import { updateShouldUpdateOfTree } from './vnode/VNodeShouldUpdate'; import { getPathArr } from './utils/vNodePath'; +import { injectUpdater } from '../external/devtools'; // 不可恢复错误 let unrecoverableErrorDuringBuild: any = null; @@ -281,6 +282,11 @@ function renderFromRoot(treeRoot) { if (window.__HORIZON_DEV_HOOK__) { const hook = window.__HORIZON_DEV_HOOK__; + // injector.js 可能在 Horizon 代码之后加载,此时无 __HORIZON_DEV_HOOK__ 全局变量 + // Horizon 代码初次加载时不会初始化 helper + if (!hook.isInit) { + injectUpdater(); + } hook.addIfNotInclude(treeRoot); hook.send(treeRoot); }