@tomjs/vite-plugin-hbuilderx 1.1.0 → 1.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/dist/index.d.ts +2 -1
  3. package/dist/index.js +31 -12
  4. package/package.json +1 -2
  5. package/src/index.ts +18 -13
  6. package/src/logger.ts +15 -4
  7. package/src/types.ts +2 -1
  8. package/tsconfig.web.json +5 -2
package/CHANGELOG.md CHANGED
@@ -1,3 +1,7 @@
1
+ ## [1.2.0](https://github.com/tomjs/hbuilderx/compare/vite%401.1.0...vite%401.2.0) (2026-01-06)
2
+
3
+ - feat: 使用 vite 日志 [ac9f9d9](https://github.com/tomjs/hbuilderx/commit/ac9f9d9)
4
+
1
5
  ## [1.1.0](https://github.com/tomjs/hbuilderx/compare/vite%401.0.0...vite%401.1.0) (2026-01-03)
2
6
 
3
7
  - feat: vite 导出 env 改为 types [8740464](https://github.com/tomjs/hbuilderx/commit/8740464)
package/dist/index.d.ts CHANGED
@@ -29,7 +29,7 @@ interface ExtensionOptions extends Omit<InlineConfig, 'entry' | 'format' | 'outD
29
29
  */
30
30
  interface WebviewOption {
31
31
  /**
32
- * 刷新页面的按键，如 F5/F6
32
+ * 开发模式，刷新页面的按键，如 F5/F6
33
33
  * @default "F6"
34
34
  */
35
35
  refreshKey?: string;
@@ -71,6 +71,7 @@ interface PluginOptions {
71
71
  * - `true`:
72
72
  * - react: 注入 `<script src="http://localhost:8097"></script>`
73
73
  * - vue: 注入 `<script src="http://localhost:8098"></script>`
74
+ * - `number`: 自定义端口号
74
75
  * @default false
75
76
  */
76
77
  devtools?: boolean | number;
package/dist/index.js CHANGED
@@ -8,7 +8,7 @@ import merge from "lodash.merge";
8
8
  import { parse } from "node-html-parser";
9
9
  import colors from "picocolors";
10
10
  import { build } from "tsdown";
11
- import Logger from "@tomjs/logger";
11
+ import { createLogger } from "vite";
12
12
 
13
13
  //#region ../../node_modules/.pnpm/tsdown@0.18.4_publint@0.3.16_synckit@0.11.11_typescript@5.9.3_vue-tsc@3.2.1_typescript@5.9.3_/node_modules/tsdown/esm-shims.js
14
14
  const getFilename = () => fileURLToPath(import.meta.url);
@@ -24,12 +24,28 @@ const RESOLVED_VIRTUAL_MODULE_ID = `\0${VIRTUAL_MODULE_ID}`;
24
24
 
25
25
  //#endregion
26
26
  //#region src/logger.ts
27
- function createLogger() {
28
- return new Logger({
27
+ function createLogger$1(logLevel) {
28
+ const logger$1 = createLogger(logLevel, {
29
29
  prefix: `[${PLUGIN_NAME}]`,
30
- time: true
30
+ allowClearScreen: true
31
31
  });
32
+ [
33
+ "info",
34
+ "warn",
35
+ "warnOnce",
36
+ "error"
37
+ ].forEach((level) => {
38
+ const _level = logger$1[level];
39
+ logger$1[level] = (msg, options) => {
40
+ _level(msg, Object.assign({
41
+ timestamp: true,
42
+ clear: false
43
+ }, options));
44
+ };
45
+ });
46
+ return logger$1;
32
47
  }
48
+ const logger = createLogger$1();
33
49
 
34
50
  //#endregion
35
51
  //#region src/utils.ts
@@ -67,7 +83,6 @@ function resolveServerUrl(server) {
67
83
  //#endregion
68
84
  //#region src/index.ts
69
85
  const isDev = process.env.NODE_ENV === "development";
70
- const logger = createLogger();
71
86
  function getPkg() {
72
87
  const pkgFile = path.resolve(process.cwd(), "package.json");
73
88
  if (!fs.existsSync(pkgFile)) throw new Error("项目中未找到 package.json 文件");
@@ -118,9 +133,7 @@ function preMergeOptions(options) {
118
133
  function genProdWebviewCode(cache) {
119
134
  function handleHtmlCode(html) {
120
135
  const root = parse(html);
121
- const head = root.querySelector("head");
122
- if (!head) root?.insertAdjacentHTML("beforeend", "<head></head>");
123
- head.insertAdjacentHTML("afterbegin", "<style>:root{--root-background-color:#fffae8;background-color:var(--root-background-color)}</style>");
136
+ if (!root.querySelector("head")) root?.insertAdjacentHTML("beforeend", "<head></head>");
124
137
  const tags = {
125
138
  script: "src",
126
139
  link: "href"
@@ -223,10 +236,10 @@ function useHBuilderxPlugin(options) {
223
236
  NODE_ENV: server.config.mode || "development",
224
237
  VITE_DEV_SERVER_URL: resolveServerUrl(server)
225
238
  };
226
- logger.info("extension build start");
227
- let buildCount = 0;
239
+ logger.info("插件编译开始");
228
240
  const webview = opts?.webview;
229
241
  const { onSuccess: _onSuccess, ignoreWatch, logLevel, watchFiles, ...tsdownOptions } = opts.extension || {};
242
+ const entryDir = path.dirname(tsdownOptions.entry);
230
243
  await build(merge(tsdownOptions, {
231
244
  watch: watchFiles ?? (opts.recommended ? ["extension"] : true),
232
245
  ignoreWatch: [
@@ -245,6 +258,13 @@ function useHBuilderxPlugin(options) {
245
258
  },
246
259
  load(id) {
247
260
  if (id === RESOLVED_VIRTUAL_MODULE_ID) return devWebviewVirtualCode;
261
+ },
262
+ watchChange(id, e) {
263
+ let event = "";
264
+ if (e.event === "update") event = colors.green("更新");
265
+ else if (e.event === "delete") event = colors.red("删除");
266
+ else event = colors.blue("创建");
267
+ logger.info(`${event} ${colors.dim(path.relative(entryDir, id))}`);
248
268
  }
249
269
  }],
250
270
  async onSuccess(config, signal) {
@@ -252,8 +272,7 @@ function useHBuilderxPlugin(options) {
252
272
  if (typeof _onSuccess === "string") await execa(_onSuccess);
253
273
  else if (typeof _onSuccess === "function") await _onSuccess(config, signal);
254
274
  }
255
- if (buildCount++ > 1) logger.info("extension rebuild success");
256
- else logger.info("extension build success");
275
+ logger.info("插件编译成功");
257
276
  }
258
277
  }));
259
278
  });
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@tomjs/vite-plugin-hbuilderx",
3
3
  "type": "module",
4
- "version": "1.1.0",
4
+ "version": "1.2.0",
5
5
  "description": "为 HBuilderX 开发插件提供 vite 插件，可以使用 vue/react 开发 webview 的视图等",
6
6
  "author": {
7
7
  "name": "Tom Gao",
@@ -43,7 +43,6 @@
43
43
  "vite": ">=5"
44
44
  },
45
45
  "dependencies": {
46
- "@tomjs/logger": "^1.4.0",
47
46
  "@tomjs/node": "^2.2.3",
48
47
  "execa": "^9.6.1",
49
48
  "lodash.merge": "^4.6.2",
package/src/index.ts CHANGED
@@ -11,13 +11,12 @@ import { parse as htmlParser } from 'node-html-parser';
11
11
  import colors from 'picocolors';
12
12
  import { build as tsdownBuild } from 'tsdown';
13
13
  import { ORG_NAME, RESOLVED_VIRTUAL_MODULE_ID, VIRTUAL_MODULE_ID } from './constants';
14
- import { createLogger } from './logger';
14
+ import { logger } from './logger';
15
15
  import { resolveServerUrl } from './utils';
16
16
 
17
17
  export * from './types';
18
18
 
19
19
  const isDev = process.env.NODE_ENV === 'development';
20
- const logger = createLogger();
21
20
 
22
21
  function getPkg() {
23
22
  const pkgFile = path.resolve(process.cwd(), 'package.json');
@@ -101,8 +100,6 @@ function genProdWebviewCode(cache: Record<string, string>) {
101
100
  root?.insertAdjacentHTML('beforeend', '<head></head>');
102
101
  }
103
102
 
104
- head.insertAdjacentHTML('afterbegin', '<style>:root{--root-background-color:#fffae8;background-color:var(--root-background-color)}</style>');
105
-
106
103
  const tags = {
107
104
  script: 'src',
108
105
  link: 'href',
@@ -257,13 +254,13 @@ export function useHBuilderxPlugin(options?: PluginOptions): PluginOption {
257
254
  VITE_DEV_SERVER_URL: resolveServerUrl(server),
258
255
  };
259
256
 
260
- logger.info('extension build start');
261
-
262
- let buildCount = 0;
257
+ logger.info('插件编译开始');
263
258
 
264
259
  const webview = opts?.webview as WebviewOption;
265
260
 
266
261
  const { onSuccess: _onSuccess, ignoreWatch, logLevel, watchFiles, ...tsdownOptions } = opts.extension || {};
262
+ const entryDir = path.dirname(tsdownOptions.entry);
263
+
267
264
  await tsdownBuild(
268
265
  merge(tsdownOptions, {
269
266
  watch: watchFiles ?? (opts.recommended ? ['extension'] : true),
@@ -284,6 +281,19 @@ export function useHBuilderxPlugin(options?: PluginOptions): PluginOption {
284
281
  if (id === RESOLVED_VIRTUAL_MODULE_ID)
285
282
  return devWebviewVirtualCode;
286
283
  },
284
+ watchChange(id, e) {
285
+ let event = '';
286
+ if (e.event === 'update') {
287
+ event = colors.green('更新');
288
+ }
289
+ else if (e.event === 'delete') {
290
+ event = colors.red('删除');
291
+ }
292
+ else {
293
+ event = colors.blue('创建');
294
+ }
295
+ logger.info(`${event} ${colors.dim(path.relative(entryDir, id))}`);
296
+ },
287
297
  },
288
298
  ],
289
299
  async onSuccess(config, signal) {
@@ -296,12 +306,7 @@ export function useHBuilderxPlugin(options?: PluginOptions): PluginOption {
296
306
  }
297
307
  }
298
308
 
299
- if (buildCount++ > 1) {
300
- logger.info('extension rebuild success');
301
- }
302
- else {
303
- logger.info('extension build success');
304
- }
309
+ logger.info('插件编译成功');
305
310
  },
306
311
  } as TsdownOptions),
307
312
  );
package/src/logger.ts CHANGED
@@ -1,9 +1,20 @@
1
- import Logger from '@tomjs/logger';
1
+ import type { LogLevel, LogOptions } from 'vite';
2
+ import { createLogger as _createLogger } from 'vite';
2
3
  import { PLUGIN_NAME } from './constants';
3
4
 
4
- export function createLogger() {
5
- return new Logger({
5
+ export function createLogger(logLevel?: LogLevel) {
6
+ const logger = _createLogger(logLevel, {
6
7
  prefix: `[${PLUGIN_NAME}]`,
7
- time: true,
8
+ allowClearScreen: true,
8
9
  });
10
+
11
+ ['info', 'warn', 'warnOnce', 'error'].forEach((level) => {
12
+ const _level = logger[level];
13
+ logger[level] = (msg: string, options?: LogOptions) => {
14
+ _level(msg, Object.assign({ timestamp: true, clear: false } as LogOptions, options));
15
+ };
16
+ });
17
+ return logger;
9
18
  }
19
+
20
+ export const logger = createLogger();
package/src/types.ts CHANGED
@@ -32,7 +32,7 @@ export interface ExtensionOptions
32
32
  */
33
33
  export interface WebviewOption {
34
34
  /**
35
- * 刷新页面的按键，如 F5/F6
35
+ * 开发模式，刷新页面的按键，如 F5/F6
36
36
  * @default "F6"
37
37
  */
38
38
  refreshKey?: string;
@@ -75,6 +75,7 @@ export interface PluginOptions {
75
75
  * - `true`:
76
76
  * - react: 注入 `<script src="http://localhost:8097"></script>`
77
77
  * - vue: 注入 `<script src="http://localhost:8098"></script>`
78
+ * - `number`: 自定义端口号
78
79
  * @default false
79
80
  */
80
81
  devtools?: boolean | number;
package/tsconfig.web.json CHANGED
@@ -1,9 +1,12 @@
1
1
  {
2
- "extends": "@tomjs/tsconfig/web.json",
2
+ "extends": "@tomjs/tsconfig/vue-dom.json",
3
3
  "compilerOptions": {
4
4
  "composite": true,
5
5
  "allowImportingTsExtensions": false,
6
6
  "noEmit": false
7
7
  },
8
- "include": ["src/webview/client.ts", "src/webview/window.d.ts"]
8
+ "include": [
9
+ "src/webview/client.ts",
10
+ "src/webview/window.d.ts"
11
+ ]
9
12
  }