@tomjs/vite-plugin-vscode 2.6.0 → 3.0.0

package/README.md

@@ -14,6 +14,7 @@ In development mode, inject the same code of [@tomjs/vscode-extension-webview](h
 - Simple configuration, focus on business
 - Support `esm` and `cjs`
 - Support webview `HMR`
+- Support `acquireVsCodeApi` of [@types/vscode-webview](https://www.npmjs.com/package/@types/vscode-webview)
 - Support [Multi-Page App](https://vitejs.dev/guide/build.html#multi-page-app)
 - Supports `vue` and `react` and other [frameworks](https://cn.vitejs.dev/guide/#trying-vite-online) supported by `vite`
 
@@ -384,3 +385,11 @@ Open the [examples](./examples) directory, there are `vue` and `react` examples.
 - [@tomjs/vscode](https://npmjs.com/package/@tomjs/vscode): Some utilities to simplify the development of [VSCode Extensions](https://marketplace.visualstudio.com/VSCode).
 - [@tomjs/vscode-dev](https://npmjs.com/package/@tomjs/vscode-dev): Some development tools to simplify the development of [vscode extensions](https://marketplace.visualstudio.com/VSCode).
 - [@tomjs/vscode-webview](https://npmjs.com/package/@tomjs/vscode-webview): Optimize the `postMessage` issue between `webview` page and [vscode extensions](https://marketplace.visualstudio.com/VSCode)
+
+## Important Notes
+
+### v3.0.0
+
+**Breaking Updates:**
+
+- The simulated `acquireVsCodeApi` is consistent with the `acquireVsCodeApi` of [@types/vscode-webview](https://www.npmjs.com/package/@types/vscode-webview), and `sessionStorage.getItem` and `sessionStorage.setItem` are used to implement `getState` and `setState`.

package/README.zh_CN.md

@@ -14,6 +14,7 @@
 - 配置简单，专注业务
 - 支持 `esm`和 `cjs`
 - 支持 webview `HMR`
+- 支持 [@types/vscode-webview](https://www.npmjs.com/package/@types/vscode-webview) 的 `acquireVsCodeApi`
 - 支持[多页面应用](https://cn.vitejs.dev/guide/build.html#multi-page-app)
 - 支持 `vue` 、`react` 等其他 `vite` 支持的[框架](https://cn.vitejs.dev/guide/#trying-vite-online)
 
@@ -387,3 +388,11 @@ pnpm build
 - [@tomjs/vscode](https://npmjs.com/package/@tomjs/vscode): 一些实用工具，用于简化 [vscode 扩展](https://marketplace.visualstudio.com/VSCode) 的开发。
 - [@tomjs/vscode-dev](https://npmjs.com/package/@tomjs/vscode-dev): 一些开发工具，用于简化 [vscode 扩展](https://marketplace.visualstudio.com/VSCode) 的开发。
 - [@tomjs/vscode-webview](https://npmjs.com/package/@tomjs/vscode-webview): 优化 `webview` 页面与 [vscode 扩展](https://marketplace.visualstudio.com/VSCode) 的 `postMessage` 问题
+
+## 重要说明
+
+### v3.0.0
+
+**破坏性更新：**
+
+- 模拟的 `acquireVsCodeApi` 与 [@types/vscode-webview](https://www.npmjs.com/package/@types/vscode-webview) 的 `acquireVsCodeApi` 保持一致，改用 `sessionStorage.getItem` 和 `sessionStorage.setItem` 来实现 `getState` 和 `setState`。

package/dist/client.global.js

@@ -35,8 +35,6 @@
           document.head.appendChild(defaultStyles);
         });
       }
-      var GET_STATE_TYPE = "[vscode:client]:getState";
-      var SET_STATE_TYPE = "[vscode:client]:setState";
       var POST_MESSAGE_TYPE = "[vscode:client]:postMessage";
       function patchAcquireVsCodeApi() {
         class AcquireVsCodeApi {
@@ -46,31 +44,12 @@
           }
           getState() {
             console.log(TAG, "mock acquireVsCodeApi.getState");
-            return new Promise((resolve, reject) => {
-              function post() {
-                window.parent.postMessage({ type: GET_STATE_TYPE }, "*");
-              }
-              const timeoutId = setTimeout(() => {
-                window.removeEventListener("message", receive);
-                reject(new Error("Timeout"));
-              }, 2e3);
-              function receive(e) {
-                var _a, _b;
-                console.log(e);
-                if (!e.origin.startsWith("vscode-webview://") || ((_a = e.data) == null ? void 0 : _a.type) !== GET_STATE_TYPE) {
-                  return;
-                }
-                window.removeEventListener("message", receive);
-                clearTimeout(timeoutId);
-                resolve((_b = e.data) == null ? void 0 : _b.data);
-              }
-              window.addEventListener("message", receive);
-              post();
-            });
+            const state = sessionStorage.getItem("vscodeState");
+            return state ? JSON.parse(state) : void 0;
           }
           setState(newState) {
             console.log(TAG, "mock acquireVsCodeApi.setState:", newState);
-            window.parent.postMessage({ type: SET_STATE_TYPE, data: newState }, "*");
+            sessionStorage.setItem("vscodeState", JSON.stringify(newState));
             return newState;
           }
         }

package/dist/index.d.mts

@@ -1,4 +1,4 @@
-import { Plugin } from 'vite';
+import { PluginOption } from 'vite';
 import { Options } from 'tsup';
 
 /**
@@ -90,6 +90,6 @@ interface PluginOptions {
     extension?: ExtensionOptions;
 }
 
-declare function useVSCodePlugin(options?: PluginOptions): Plugin[];
+declare function useVSCodePlugin(options?: PluginOptions): PluginOption;
 
 export { ExtensionOptions, PluginOptions, WebviewOption, useVSCodePlugin as default, useVSCodePlugin };

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import { Plugin } from 'vite';
+import { PluginOption } from 'vite';
 import { Options } from 'tsup';
 
 /**
@@ -90,6 +90,6 @@ interface PluginOptions {
     extension?: ExtensionOptions;
 }
 
-declare function useVSCodePlugin(options?: PluginOptions): Plugin[];
+declare function useVSCodePlugin(options?: PluginOptions): PluginOption;
 
 export { ExtensionOptions, PluginOptions, WebviewOption, useVSCodePlugin as default, useVSCodePlugin };

package/dist/index.js

@@ -3,7 +3,6 @@ var _fs = require('fs'); var _fs2 = _interopRequireDefault(_fs);
 var _os = require('os'); var _os2 = _interopRequireDefault(_os);
 var _path = require('path'); var _path2 = _interopRequireDefault(_path);
 var _process = require('process');
-var _lodashclonedeep = require('lodash.clonedeep'); var _lodashclonedeep2 = _interopRequireDefault(_lodashclonedeep);
 var _lodashmerge = require('lodash.merge'); var _lodashmerge2 = _interopRequireDefault(_lodashmerge);
 var _nodehtmlparser = require('node-html-parser');
 var _tsup = require('tsup');
@@ -119,7 +118,7 @@ function preMergeOptions(options) {
         skipNodeModulesBundle: isDev
       }
     },
-    _lodashclonedeep2.default.call(void 0, options)
+    options
   );
   const opt = opts.extension || {};
   ["entry", "format"].forEach((prop) => {

package/dist/index.mjs

@@ -1,4 +1,4 @@
-// node_modules/.pnpm/tsup@7.2.0_@swc+core@1.3.100_postcss@8.4.32_typescript@5.3.3/node_modules/tsup/assets/esm_shims.js
+// node_modules/.pnpm/tsup@7.2.0_@swc+core@1.7.26_postcss@8.4.32_typescript@5.3.3/node_modules/tsup/assets/esm_shims.js
 import { fileURLToPath } from "url";
 import path from "path";
 var getFilename = () => fileURLToPath(import.meta.url);
@@ -10,7 +10,6 @@ import fs from "fs";
 import os from "os";
 import path2 from "path";
 import { cwd } from "process";
-import cloneDeep from "lodash.clonedeep";
 import merge from "lodash.merge";
 import { parse as htmlParser } from "node-html-parser";
 import { build as tsupBuild } from "tsup";
@@ -126,7 +125,7 @@ function preMergeOptions(options) {
         skipNodeModulesBundle: isDev
       }
     },
-    cloneDeep(options)
+    options
   );
   const opt = opts.extension || {};
   ["entry", "format"].forEach((prop) => {

package/dist/webview.js

@@ -102,16 +102,6 @@ var template_default = `<!doctype html>
           console.log(TAG + ' received:', e.data);
           if (type === '[vscode:client]:postMessage') {
             getApi().postMessage(data);
-          } else if (type === '[vscode:client]:getState') {
-            iframe.contentWindow.postMessage(
-              {
-                type: '[vscode:client]:getState',
-                data: getApi().getState(),
-              },
-              '*',
-            );
-          } else if (type === '[vscode:client]:setState') {
-            getApi().setState(data);
           }
         }
       }

package/dist/webview.mjs

@@ -102,16 +102,6 @@ var template_default = `<!doctype html>
           console.log(TAG + ' received:', e.data);
           if (type === '[vscode:client]:postMessage') {
             getApi().postMessage(data);
-          } else if (type === '[vscode:client]:getState') {
-            iframe.contentWindow.postMessage(
-              {
-                type: '[vscode:client]:getState',
-                data: getApi().getState(),
-              },
-              '*',
-            );
-          } else if (type === '[vscode:client]:setState') {
-            getApi().setState(data);
           }
         }
       }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tomjs/vite-plugin-vscode",
-  "version": "2.6.0",
+  "version": "3.0.0",
   "description": "Use vue/react to develop 'vscode extension webview', supporting esm/cjs",
   "keywords": [
     "vite",
@@ -79,7 +79,7 @@
     "@tomjs/tsconfig": "^1.3.0",
     "@types/lodash.clonedeep": "^4.5.9",
     "@types/lodash.merge": "^4.6.9",
-    "@types/node": "^18.19.7",
+    "@types/node": "18.19.55",
     "cross-env": "^7.0.3",
     "eslint": "^8.56.0",
     "husky": "^8.0.3",
@@ -89,7 +89,8 @@
     "rimraf": "^5.0.5",
     "stylelint": "^16.1.0",
     "tsx": "^4.7.0",
-    "typescript": "~5.3.3"
+    "typescript": "~5.3.3",
+    "vite": "5.4.8"
   },
   "peerDependencies": {
     "vite": ">=2"